dev/dcp-web-gate/src_old/views/NationalregionalCommissions/CommitteeInformation.vue

<!-- 委员会全部资料列表 -->
<template>
	<div class="autoBox box1" style="position: relative; background: #f5f5f5">
		<div class="center" style="">
			<div class="left">
				<div class="topImg" style="display: flex">
					<div class="topLeft">
						<span>{{ $t("common.comprehensive") }}/</span>
						<span>{{ $t("common.detailed") }}/</span>
						<span>{{ $t("common.major") }}</span>
					</div>
					<div class="topTitle">
						<h1>{{ $t("common.committeeInformation") }}</h1>
					</div>

					<div class="topRight">
						<img
								class="img1"
								style="display: block; width: 176px; height: 232px"
								src="@/assets/img/committeeWorkSpace/img3.png"
								alt=""
						/>
						<img
								class="img2"
								style="display: block; width: 176px; height: 232px"
								src="@/assets/img/committeeWorkSpace/img2.png"
								alt=""
						/>
						<img
								class="img3"
								style="display: block; width: 176px; height: 232px"
								src="@/assets/img/committeeWorkSpace/img1.png"
								alt=""
						/>
					</div>
				</div>
				<div :class="$i18n.locale=='zh'?'centerLeft1':'centerLeft1En'">
					<div class="topSearch">
						<el-input
								@clear="reset"
								@change="searchTitle"
								clearable
								suffix-icon="el-icon-search"
								style="width: 200px; height: 20px; margin-top: 10px"
								v-model="search"
								:placeholder="$t('common.pleaseEnter')"
						></el-input>
						<el-button
								@click="toUpload"
								style="margin-left: 10px"
								type="primary"
								plain
						>{{ $t("common.upload") }}</el-button
						>

						<el-button
								plain
								v-if="isSubscription"
								@click="cancelSubscribe"
								type="danger"
						>{{ $t("common.cancelSubscribe") }}</el-button
						>
						<!--<el-button
								plain
								v-if="!isSubscription"
								@click="subscribe"
								type="danger"
						>{{ $t("common.subscribe") }}</el-button
						>-->
					</div>
					<div class="area">
						<Screen
								v-bind:screen1="screen1s"
								:screen2="screen2s"
								:screen1def="screen1def"
								:screen2Item="screen2Item"
								@screenBack="screenBack"
						></Screen>
						<div class="choice">
							<el-select
									clearable
									@clear="reset1"
									v-model="regionalNationalCommission"
									style="width: 150px; height: 20px"
									:placeholder="$t('common.select')"
							>
								<el-option
										v-for="item in regionalNationalCommissionList"
										:key="item.id"
										:label="$i18n.locale === 'en' ? item.committeeNameEn : item.committeeName"
										:value="item.id"
								>
								</el-option>
							</el-select>
						</div>
					</div>
					<!--<div v-cloak :class="$i18n.locale=='zh'?'toggleLabel':'toggleLabelEn'">
						<ul style="display: flex">
							<li v-if="$i18n.locale=='zh'?true:false" v-for="(item,index) in switchList" :class="demo == index ?'switchSecond':'switchFirst'" style="width: 100px;line-height: 50px" :key="index" @click="switchTabs(index)"
							>
								{{item}}
							</li>
							<li v-if="$i18n.locale=='zh'?false:true" v-for="(item,index) in switchList1" :class="demo == index ?'switchSecond':'switchFirst'" style="width: 100px;line-height: 50px" :key="index" @click="switchTabs(index)"
							>
								{{item}}
							</li>
						</ul>
					</div>-->
					<div v-if="demo== 0?true:false">
						<div v-if="showContent" style="width: 100%" :class="$i18n.locale=='zh'?'content':'contentEn'">
							<ul>
								<li
										v-for="(item, index) in allInformation"
										style="margin-left: 25px; margin-right: 15px; float: left"
										@click="toDetail(item)"
								>
									<el-card>
										<img
												style="width: 208px; height: 288px; display: block"
												:src="'data:image/jpeg;base64,' + item.coverBase64"
												alt=""
										/>
									</el-card>
									<div class="title" style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
										<span :title="item.title" >{{ item.title }}</span>
									</div>
									<div class="committee" style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
										<span :title="item.reserveFour" >{{ item.reserveFour }}</span>
									</div>
									<div class="Time">
                  <span>{{
		                  item.createDate | time("YYYY-MM-DD HH:mm:ss")
	                  }}</span>
									</div>
								</li>
							</ul>
						</div>
						<div v-else :class="$i18n.locale=='zh'?'content':'contentEn'">
							<div style="margin-left: 550px">
								<el-empty :description="$t('common.noData')"></el-empty>
							</div>
						</div>
						<!-- 分页 -->
						<div class="pag">
							<el-pagination
									type="index"
									background
									:prev-text= "prevText"
									:next-text="nextText"
									layout="prev, pager, next,  total"
									:page-sizes="[8, 20, 50, 100, 200]"
									:total="total - 0"
									@current-change="handleCurrentChange"
									@size-change="handleSizeChange"
							></el-pagination>
						</div>
					</div>
					<div v-else>
						<div v-if="showContent1" style="width: 100%" :class="$i18n.locale=='zh'?'content':'contentEn'">
							<ul>
								<li
										v-for="(item, index) in subscribeList"
										style="margin-left: 25px; margin-right: 15px; float: left"
										@click="toDetail(item)"
								>
									<el-card>
										<img
												style="width: 208px; height: 288px; display: block"
												:src="'data:image/jpeg;base64,' + item.coverBase64"
												alt=""
										/>
									</el-card>
									<div class="title" style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
										<span :title="item.title" >{{ item.title }}</span>
									</div>
									<div class="committee" style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
										<span :title="item.reserveFour" >{{ item.reserveFour }}</span>
									</div>
									<div class="Time">
                  <span>{{
		                  item.createDate | time("YYYY-MM-DD HH:mm:ss")
	                  }}</span>
									</div>
								</li>
							</ul>
						</div>
						<div  v-if="!showContent1" :class="$i18n.locale=='zh'?'content':'contentEn'">
							<div style="margin-left: 550px">
								<el-empty :description="$t('common.noData')"></el-empty>
							</div>
						</div>
						<!-- 分页 -->
						<div v-if="showContent1" class="pag">
							<el-pagination
									type="index"
									background
									:prev-text= "prevText"
									:next-text="nextText"
									layout="prev, pager, next, total"
									:page-sizes="[8, 20, 50, 100, 200]"
									:total="total1 - 0"
									@current-change="handleCurrentChange1"
									@size-change="handleSizeChange1"
							></el-pagination>
						</div>
					</div>
				</div>


				<!-- 订阅dialog -->
				<el-dialog
						:visible.sync="subscribeDialogVisible"
						width="30%"
						:before-close="dialogBeforeClose"
				>
					<div style="padding: 0 50px 0 0px">
						<el-form ref="form" :model="form" label-width="200px">
							<el-form-item :label="$t('common.subscribe')">
								<el-select
										multiple
										style="width: 80%;overflow: hidden;text-overflow: ellipsis;white-space: normal;"
										v-model="form.committee"
										:placeholder="$t('common.selectCommittee')"
								>
									<el-option
											v-for="item in nationalCommitteeList"
											:key="item.id"
											:label="$i18n.locale === 'en' ? item.label2 : item.label"
											:value="item.id"
									>
									</el-option>
								</el-select>
								<div style="display: flex">
									<img
											style="
                      display: block;
                      width: 16px;
                      height: 16px;
                      margin-top: 10px;
                    "
											src="@/assets/img/committeeWorkSpace/tishi.png"
											alt=""
									/>
									<span style="margin-left: 5px">{{
											$t("common.multipleCommittee")
										}}</span>
								</div>
							</el-form-item>
							<el-form-item :label="$t('common.updateNotice')">
								<el-radio-group v-model="form.resource">
									<el-radio label="2">{{ $t("common.noNeed") }}</el-radio>
									<el-radio label="1">{{ $t("common.need") }}</el-radio>
								</el-radio-group>
							</el-form-item>
							<el-form-item v-if="isShow" :label="$t('common.mail')">
								<el-input
										style="width: 80%"
										v-model="form.email"
										:placeholder="$t('common.pleaseInput')"
								></el-input>
							</el-form-item>
							<el-form-item v-if="isShow" :label="$t('common.pushFrequency')">
								<el-select
										style="width: 80%"
										v-model="form.push"
										:placeholder="$t('common.select')"
								>
									<el-option
											:label="$t('common.monthly')"
											value="1"
									></el-option>
									<el-option :label="$t('common.season')" value="2"></el-option>
								</el-select>
							</el-form-item>
						</el-form>
						<div class="backImg">
							<img
									src="@/assets/img/committeeWorkSpace/background (2).png"
									alt=""
							/>
						</div>
					</div>
					<div slot="footer" style="margin-right: 28%">
						<el-button
								type="primary"
								style="width: 120px"
								@click="subscription"
						>{{ $t("common.subscribe") }}</el-button
						>
						<el-button style="width: 120px" @click="cancel">{{
								$t("common.cancel")
							}}</el-button>
					</div>
				</el-dialog>
			</div>
		</div>
	</div>
</template>
<script>
import {
	toObtainListAllInformation2,
	allDataQuery,
	queryNationalCommittee,
	getNationalCommittee,
	allDataSubscription,
	determineWhetherToSubscribeTo,
	getTheSubscriptionListOfAllMaterials,
	unsubscribe,
} from "@/api/committee/committeeWorkSpace";
import moment from "moment";
import { getToken } from "@/api/token";
import Screen from "@/components/screen";
import {getWorkSpacePermission} from "@/api/committee/nrc";
export default {
	name: "CommitteeInformation",
	components: {
		Screen,
	},
	data() {
		return {
			switchList:['全部',"订阅"],
			switchList1:['All',"Subscribe"],
			activeName:'first',
			data: [
				{
					url: "https://img0.baidu.com/it/u=1612726526,4275795108&fm=253&fmt=auto&app=138&f=JPEG?w=717&h=500",
					id: 1,
					time: "2021-10-31",
					type: "哥伦比亚互联网研究",
				},
				{
					url: "https://img0.baidu.com/it/u=1612726526,4275795108&fm=253&fmt=auto&app=138&f=JPEG?w=717&h=500",
					id: 2,
					time: "2021-10-31",
					type: "全球能源互联网解决无电、贫困、健康问题行动计划",
				},
				{
					url: "https://img0.baidu.com/it/u=1612726526,4275795108&fm=253&fmt=auto&app=138&f=JPEG?w=717&h=500",
					id: 3,
					time: "2021-10-31",
					type: "公文",
				},
				{
					url: "https://img0.baidu.com/it/u=1612726526,4275795108&fm=253&fmt=auto&app=138&f=JPEG?w=717&h=500",
					id: 4,
					time: "2021-10-31",
					type: "公文",
				},
				{
					url: "https://img0.baidu.com/it/u=1612726526,4275795108&fm=253&fmt=auto&app=138&f=JPEG?w=717&h=500",
					id: 5,
					time: "2021-10-31",
					type: "公文",
				},
				{
					url: "https://img0.baidu.com/it/u=1612726526,4275795108&fm=253&fmt=auto&app=138&f=JPEG?w=717&h=500",
					id: 6,
					time: "2021-10-31",
					type: "公文",
				},
			],
			form: {
				committee: "",
				resource: "1",
				email: "",
				push: "",
			},
			pageSize:undefined,
			pageSize1:undefined,
			isShow: true,
			subscribeDialogVisible: null,
			imformationSearch: "",
			search: "",
			prevText:"上一页",
			nextText:"下一页",
			screen1s: {
				value: "common.regionalCommissions",
				item: [],
			},
			screen2s: {
				value: "common.Byletter",
				item: [
					{
						value: null,
						ifValue: true,
						label: "common.All",
					},
					{
						ifValue: false,
						value: "A",
						label: "A",
					},
					{
						ifValue: false,
						value: "B",
						label: "B",
					},
					{
						ifValue: false,
						value: "C",
						label: "C",
					},
					{
						ifValue: false,
						value: "D",
						label: "D",
					},
					{
						ifValue: false,
						value: "E",
						label: "E",
					},
					{
						ifValue: false,
						value: "F",
						label: "F",
					},
					{
						ifValue: false,
						value: "G",
						label: "G",
					},
					{
						ifValue: false,
						value: "H",
						label: "H",
					},
					{
						ifValue: false,
						value: "I",
						label: "I",
					},
					{
						ifValue: false,
						value: "J",
						label: "J",
					},
					{
						ifValue: false,
						value: "K",
						label: "K",
					},
					{
						ifValue: false,
						value: "L",
						label: "L",
					},
					{
						ifValue: false,
						value: "M",
						label: "M",
					},
					{
						ifValue: false,
						value: "N",
						label: "N",
					},
					{
						ifValue: false,
						value: "O",
						label: "O",
					},
					{
						ifValue: false,
						value: "P",
						label: "P",
					},
					{
						ifValue: false,
						value: "Q",
						label: "Q",
					},
					{
						ifValue: false,
						value: "R",
						label: "R",
					},
					{
						ifValue: false,
						value: "S",
						label: "S",
					},
					{
						ifValue: false,
						value: "T",
						label: "T",
					},
					{
						ifValue: false,
						value: "U",
						label: "U",
					},
					{
						ifValue: false,
						value: "V",
						label: "V",
					},
					{
						ifValue: false,
						value: "W",
						label: "W",
					},
					{
						ifValue: false,
						value: "X",
						label: "X",
					},
					{
						ifValue: false,
						value: "Y",
						label: "Y",
					},
					{
						ifValue: false,
						value: "Z",
						label: "Z",
					},
				],
			},
			screen1def: null,
			screen2Item: null,
			allInformation: [],
			regionalNationalCommission: "",
			regionalNationalCommissionList: [],
			regionalNationalCommissionListFull: [],
			committeeoptionsfull: [],
			total: "",
			total1: "",
			pageNo: "",
			pageNo1: "",
			committee: "",
			letter: "",
			showContent: true,
			showContent1: true,
			nationalCommitteeList: [],
			subscriptionInformation: {
				createBy: "",
				createDate: "",
				frequency: "",
				id: "",
				mailAddr: "",
				reserveFive: "",
				reserveFour: "",
				reserveOne: "",
				reserveThree: "",
				reserveTwo: "",
				sendMail: "",
				subscribeCommittee: "",
				subscribeStatus: "",
				subscribeTime: "",
				subscriber: "",
				updateBy: "",
				updateDate: "",
			},

			isSubscription: null,
			imgPath: "",
			imgUrlZero: "",
			imgUrlOne: "",
			imgUrlTwo: "",
			imgUrlThree: "",
			imgUrlFour: "",
			imgUrlFive: "",
			imgUrlSix: "",
			imgUrlSeven: "",
			demo:0,
			subscribeList:[],
		};
	},
	filters: {
		time(date, type) {
			return moment(date).format(type);
		},
	},
	watch: {
		"$i18n.locale"() {
			this.queryNationalCommittee();
			this.toObtainListAllInformation();
			if(this.$i18n.locale != 'en'){
				this.prevText="上一页";
				this.nextText="下一页";
			}else{
				this.prevText="Previous";
				this.nextText="Next";
			}

			this.nationalCommitteeList = new Array();
			if(this.$i18n.locale == "en"){
				for(let i=0;i<this.committeeoptionsfull.length;i++){
					if(this.committeeoptionsfull[i].label2!="" && this.committeeoptionsfull[i].label2!=null && this.committeeoptionsfull[i].label2!=undefined){
						this.nationalCommitteeList.push(this.committeeoptionsfull[i]);
					}
				}
			}else{
				this.nationalCommitteeList = this.committeeoptionsfull;
			}


			this.regionalNationalCommissionList = new Array();
			if(this.$i18n.locale == "en"){
				for(let i=0;i<this.regionalNationalCommissionListFull.length;i++){
					if(this.regionalNationalCommissionListFull[i].committeeNameEn!="" && this.regionalNationalCommissionListFull[i].committeeNameEn!=null && this.regionalNationalCommissionListFull[i].committeeNameEn!=undefined){
						this.regionalNationalCommissionList.push(this.regionalNationalCommissionListFull[i]);
					}
				}
			}else{
				this.regionalNationalCommissionList = this.regionalNationalCommissionListFull;
			}
		},
		"form.resource": {
			handler() {
				if (this.form.resource === "2") {
					this.isShow = false;
				} else {
					this.isShow = true;
				}
			},
			deep: true,
		},
		regionalNationalCommission: {
			handler() {
				this.committee = this.regionalNationalCommission;
				this.toObtainListAllInformation();
				this.getSubscriptionList();
			},
			deep: true,
		},
	},
	mounted() {
		this.initData();
		if(this.$i18n.locale != 'en'){
			this.prevText="上一页";
			this.nextText="下一页";
		}else{
			this.prevText="Previous";
			this.nextText="Next";
		}
	},
	destroyed() {},
	methods: {
		switchTabs(index) {
		   this.demo = index
		},
		initData() {
			this.determineWhetherToSubscribeTo();
			this.toObtainListAllInformation();
			this.accessToNationalCommittee();
			this.queryNationalCommittee();
			this.getSubscriptionList();
		},

		// 查询条件
		queryNationalCommittee() {
			allDataQuery().then((res) => {
				var data = res.data;
				var dataFull = new Array();
				if(this.$i18n.locale == 'en'){
					for (let i = 0; i < data.length; i++) {
						if(data[i].label2!="" && data[i].label2!=null && data[i].label2!=undefined){
							data[i].label = data[i].label2
							dataFull.push(data[i]);
						}
					}
				}else{
					dataFull=data;
				}
				console.log(data);
				if (data) {
					this.screen1s.item = dataFull || [];
					let labelmsg = "";
					if(this.$i18n.locale == "en"){
						labelmsg = "All";
					}else{
						labelmsg = "全部";
					}
					let both = {
						label: labelmsg,
						value: null,
					};
					this.screen1s.item.unshift(both);
				}
			});
		},
		// 获取国家委员会
		accessToNationalCommittee() {
			var id = this.committee ? this.committee : "";
			queryNationalCommittee(id).then((res) => {
				this.regionalNationalCommissionListFull = res.data;
				// this.regionalNationalCommissionList = res.data;
				console.log(res.data);
				if(this.$i18n.locale == "en"){
					for(let i=0;i<this.regionalNationalCommissionListFull.length;i++){
						if(this.regionalNationalCommissionListFull[i].committeeNameEn!="" && this.regionalNationalCommissionListFull[i].committeeNameEn!=null && this.regionalNationalCommissionListFull[i].committeeNameEn!=undefined){
							this.regionalNationalCommissionList.push(this.regionalNationalCommissionListFull[i]);
						}
					}
				}else{
					this.regionalNationalCommissionList = this.regionalNationalCommissionListFull;
				}
			});
		},
		// 获取全部资料列表
		toObtainListAllInformation() {
			var params = this.pageNo ? this.pageNo : "1";
			var query = this.committee ? this.committee : "";
			var pageSize = this.pageSize ? this.pageSize : "8";
			var query1 = this.letter ? this.letter : "";
			var queryConditions = this.search ? this.search : "";
			toObtainListAllInformation2(params, pageSize, query, query1, queryConditions).then(
					(res) => {
						var data = res.data;
						if (JSON.stringify(data) !== "{}") {
							this.showContent = true;
							this.allInformation = res.data.nrcMaterialStorehouses;
							if(this.$i18n.locale == 'en'){
								for (let i = 0; i < this.allInformation.length; i++) {
									this.allInformation[i].reserveFour = this.allInformation[i].belongCommitteeEn
								}
							}
							this.total = res.data.page.totalCount;
						} else {
							this.showContent = false;
						}
					}
			);
		},

		// 获取订阅列表
		getSubscriptionList(){
			var params = this.pageNo1 ? this.pageNo1 : "1";
			var query = this.committee ? this.committee : "";
			var pageSize = this.pageSize1 ? this.pageSize1 : "8";
			var query1 = this.letter ? this.letter : "";
			var queryConditions = this.search ? this.search : "";
			getTheSubscriptionListOfAllMaterials(params, pageSize, query, query1, queryConditions).then((res) => {
				var data = res.data;
				console.log(res)
				if (JSON.stringify(data) !== "{}") {
					this.showContent1 = true;
					this.subscribeList = res.data.nrcMaterialStorehouse;
					// if(this.$i18n.locale == 'en'){
					// 	for (let i = 0; i < this.allInformation.length; i++) {
					// 		this.allInformation[i].reserveFour = this.allInformation[i].belongCommitteeEn
					// 	}
					// }
					this.total1 = res.data.page.totalCount;
				} else {
					this.subscribeList = []
					this.showContent1 = false;
				}
			})
					.catch((err) => {
						console.log(111)
							this.showContent1 = false;
					})
		},
		// 订阅  获取国家委员会
		getNationalCommitteeList() {
			getNationalCommittee().then((res) => {
				var data = res.data;
				if (data) {
					// this.nationalCommitteeList = data;
					this.committeeoptionsfull = data;
				}
				if(this.$i18n.locale == "en"){
					for(let i=0;i<this.committeeoptionsfull.length;i++){
						if(this.committeeoptionsfull[i].label2!="" && this.committeeoptionsfull[i].label2!=null && this.committeeoptionsfull[i].label2!=undefined){
							this.nationalCommitteeList.push(this.committeeoptionsfull[i]);
						}
					}
				}else{
					this.nationalCommitteeList = this.committeeoptionsfull;
				}
			});
		},

		// 判断是否订阅
		determineWhetherToSubscribeTo() {
			getToken().then((res) => {
				determineWhetherToSubscribeTo(res.data).then((res) => {
					if (res.data) {
						this.isSubscription = true;
					} else {
						this.isSubscription = false;
					}
				});
			});
		},




		// 取消订阅
		cancelSubscribe() {
			getToken().then((res) => {
				unsubscribe(res.data).then((res) => {
					if (res.status === "200") {
						this.determineWhetherToSubscribeTo();
						this.getSubscriptionList()
						let msg = '';
						if(this.$i18n.locale == 'en'){
							msg = `Unsubscribe Successfully `
						}else{
							msg = `取消订阅成功`
						}
						this.$message({
							message: msg,
							type: "success",
						});
					}
				});
			});
		},
		handleSizeChange(val) {
			this.pageSize = val;
			this.toObtainListAllInformation();
			console.log(`每页 ${val} 条`);
		},
		handleCurrentChange(val) {
			this.pageNo = val;
			this.toObtainListAllInformation();
			window.scrollTo(0, 0);
		},
		handleSizeChange1(val) {
			this.pageSize1 = val;
			this.getSubscriptionList();
			console.log(`每页 ${val} 条`);
		},
		handleCurrentChange1(val) {
			this.pageNo1 = val;
			this.getSubscriptionList();
			window.scrollTo(0, 0);
		},
		// 上传
		toUpload() {
			getWorkSpacePermission().then(res => {
				if(res.data == 1){
					this.$router.push("uploadCommitteeInformation");
				}else {
				  if(this.$i18n.locale == 'en'){
					this.$message.error("The User Does Not Have Access Permission");
				  }else {
					this.$message.error("该账户没有上传权限");
				  }
				  return
				}
		  })
		},
		// 订阅
		subscribe() {
			this.getNationalCommitteeList();
			this.subscribeDialogVisible = true;
		},

		subscription() {
			getToken().then((res) => {
				this.subscriptionInformation.frequency = this.form.push;
				this.subscriptionInformation.mailAddr = this.form.email;
				this.subscriptionInformation.sendMail = this.form.resource;
				this.subscriptionInformation.subscribeCommittee =
						this.form.committee.toString();
				let params = this.subscriptionInformation;
				console.log(params);
				allDataSubscription(res.data, params)
						.then((res) => {
							let msg ='';
							if(this.$i18n.locale == 'en'){
								msg = `Subscription Succeeded`
							}else{
								msg = `订阅成功`
							}
							if (res) {
								this.$message({
									message: msg,
									type: "success",
								});
								this.emptyForm();
								this.subscribeDialogVisible = false;
								this.determineWhetherToSubscribeTo();
								this.getSubscriptionList();
							}
						})
						.catch((error) => {
							// this.emptyForm();
							// this.subscribeDialogVisible = false;
							if(this.$i18n.locale == 'en'){
								if(error.msg=="请输入必填参数"){
									error.msg="Please enter required parameter";
								}
							}
							this.$message({
								message: `${error.msg}`,
								type: "error",
							});
						});
			});
		},
		cancel() {
			this.emptyForm();
			this.subscribeDialogVisible = false;
		},
		// 清空form
		emptyForm() {
			this.form.committee = "";
			this.form.email = "";
			this.form.push = "";
		},
		dialogBeforeClose() {
			this.emptyForm();
			this.subscribeDialogVisible = false;
		},
		toDetail(item) {
			this.$router.push({
				name: "CommitteeInformationListDetail",
				params: { id: item.id },
			});
		},
		screenBack(data) {
			this.committee = data.click1;
			this.letter = data.click2;
			this.regionalNationalCommission = "";
			this.toObtainListAllInformation();
			this.accessToNationalCommittee();
			this.getSubscriptionList()
		},

		// 搜索
		searchTitle() {
			this.toObtainListAllInformation();
			this.getSubscriptionList()
		},
		// 清空输入款
		reset() {
			this.toObtainListAllInformation();
			this.getSubscriptionList();
		},
		// 清空选择框
		reset1() {
			this.toObtainListAllInformation();
			this.getSubscriptionList();
		},
	},
};
</script>
<style scoped>
.backImg {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: -10;
}
::v-deep .el-dialog {
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	margin: 0px !important;
}
.box1 {
	padding: 0 0 20px 0;
	position: absolute;
}
.center {
	display: flex;
}
.topImg {
	display: inline-block;
	width: 1200px;
	height: 324px;
	background: url("../../assets/img/committeeWorkSpace/informationTop.png")
	no-repeat 100% 100%;
}
.topLeft {
	position: absolute;
	left: 200px;
	top: 100px;
}
.topLeft span {
	font-family: "PingFang SC";
	font-style: normal;
	font-weight: 500;
	font-size: 24px;
	line-height: 25px;
	/* display: flex;
	align-items: center; */
	text-align: center;
	font-feature-settings: "tnum" on, "lnum" on;
	color: #274e92;
}
.topTitle {
	position: absolute;
	left: 200px;
	top: 120px;
}
.topTitle h1 {
	color: #ffffff;
	font-size: 40px;
}
.topRight {
	position: absolute;
	right: 0;
	width: 500px;
	height: 324px;
}
.topRight .img1 {
	position: absolute;
	top: 70px;
	left: 20px;
	z-index: 9;
}
.topRight .img2 {
	position: absolute;
	top: 50px;
	left: 160px;
	z-index: 8;
}
.topRight .img3 {
	position: absolute;
	top: 40px;
	left: 270px;
	z-index: 7;
}
.topSearch {
	position: absolute;
	right: 20px;
}
.pag {
	position: absolute;
	bottom: 0;
	right: 25%;
}

.centerLeft1 {
	height: 1250px;
	width: 1200px;
	border-radius: 0px;
	background: #fff;
}
.centerLeft1En {
	height: 1350px;
	width: 1200px;
	border-radius: 0px;
	background: #fff;
}
.left {
	position: relative;
}
.top .top1 {
	position: absolute;
	width: 5.5px;
	height: 10.5px;
	left: 20px;
	top: 35px;
	background: #376ac7;
	z-index: 1;
}
.top .top2 {
	position: absolute;
	width: 5.5px;
	height: 15px;
	left: 20px;
	top: 35px;
	background: #83bd50;
}
.top .allApplication {
	position: absolute;
	height: 22px;
	left: 34px;
	top: 31px;
}
.top .allApplication span {
	font-family: "PingFang SC";
	font-style: normal;
	font-weight: 600;
	font-size: 16px;
	line-height: 22px;
	color: #375586;
}
.top .notice {
	position: absolute;
	height: 22px;
	left: 160px;
	top: 32px;
}
.top .notice span {
	font-family: "PingFang SC";
	font-style: normal;
	font-weight: 600;
	font-size: 16px;
	line-height: 22px;
	color: rgba(10, 10, 10, 0.85);
}
.top .more {
	position: absolute;
	height: 16px;
	right: 21px;
	top: 31px;
}
.top .more span {
	font-family: "Roboto";
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 16px;
	color: #4790f7;
}
.area {
	position: absolute;
	top: 400px;
}
.toggleLabel{
	text-align: center;
	width: 300px;
	cursor:pointer;
	position: absolute;
	top: 540px;
	margin-left: 50px;
}
.toggleLabelEn{
	text-align: center;
	width: 300px;
	cursor:pointer;
	position: absolute;
	top: 620px;
	margin-left: 50px;
}
.switchFirst{
	color:#999;
}
.switchSecond{
	color: #2779fb;
	border-bottom: 3px solid #2779fb;
}
.choice {
	position: absolute;
	right: 0;
	top: 55px;
}
.content {
	position: absolute;
	top:530px;
	overflow: auto;
	height: 62%;
}
.contentEn{
	position: absolute;
	top:630px;
	overflow: auto;
	height: 62%;
}
.contentEn .title {
	width: 208px;
	height: 30px;
	text-align: center;
	/*text-overflow: -o-ellipsis-lastline;*/
	overflow: hidden;
	text-overflow: ellipsis;
	/*display: -webkit-box;*/
	/*-webkit-line-clamp: 2;*/
	/*line-clamp: 2;*/
	-webkit-box-orient: vertical;
	margin-left: 15px;
	margin-top: 5px;
}
.contentEn .committee {
	height: 30px;
	max-width: 230px;
	/*margin-top: 10px;*/
	font-family: "PingFang SC";
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 25px;
	color: rgba(0, 0, 0, 0.65);
	text-align: center;
	font-feature-settings: "tnum" on, "lnum" on;
}
.contentEn .Time {
	/* width: 208px; */
	height: 44px;
	font-family: "PingFang SC";
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 25px;
	color: rgba(0, 0, 0, 0.65);
	text-align: center;
	font-feature-settings: "tnum" on, "lnum" on;
}
.contentEn .title span {
	font-family: "PingFang SC";
	font-style: normal;
	font-weight: 500;
	font-size: 18px;
	line-height: 22px;
	color: rgba(0, 0, 0, 0.85);
}
.content .title {
	width: 208px;
	height: 30px;
	text-align: center;
	/*text-overflow: -o-ellipsis-lastline;*/
	overflow: hidden;
	text-overflow: ellipsis;
	/*display: -webkit-box;*/
	/*-webkit-line-clamp: 2;*/
	/*line-clamp: 2;*/
	-webkit-box-orient: vertical;
	margin-left: 15px;
	margin-top: 5px;
}
.content .committee {
	height: 30px;
	max-width: 230px;
	/*margin-top: 10px;*/
	font-family: "PingFang SC";
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 25px;
	color: rgba(0, 0, 0, 0.65);
	text-align: center;
	font-feature-settings: "tnum" on, "lnum" on;
}
.content .Time {
	/* width: 208px; */
	height: 44px;
	font-family: "PingFang SC";
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 25px;
	color: rgba(0, 0, 0, 0.65);
	text-align: center;
	font-feature-settings: "tnum" on, "lnum" on;
}
.content .title span {
	font-family: "PingFang SC";
	font-style: normal;
	font-weight: 500;
	font-size: 18px;
	line-height: 22px;
	color: rgba(0, 0, 0, 0.85);
}
</style>