<!--学校详情-->
<template>
	<div class="detail-wrap">
		<div class="left box">
			<div class="box-header">
				<div class="header-left"></div>
				<div class="title">最新动态</div>
				<div class="header-right">
					<el-checkbox :checked="cRelated" label="只看涉华动态" @change="handleGetDynamics()" />
					<div :class="dynamicsType === 'org' ? 'btnRightActive' : 'btnRight'" @click="changedynamicsType()">机构动态</div>
					<div :class="dynamicsType === 'person' ? 'btnRightActive' : 'btnRight'" @click="changedynamicsType()">主官动态
					</div>
					<div class="icon">
						<img src="@/assets/icons/box-header-icon2.png" alt="" />
					</div>
					<div class="icon">
						<img src="@/assets/icons/box-header-icon3.png" alt="" />
					</div>
				</div>
			</div>
			<div class="left-main">
				<div class="left-main-item" v-for="(item, index) in curList" :key="index">
					<div class="line"></div>
					<div class="time">
						<div class="timetext">{{ item.time }}</div>
						<div class="timetext">{{ item.date }}</div>
					</div>
					<div class="icon">
						<img src="./assets/images/small-harvard.png" alt="" />
					</div>
					<div class="info">
						<div class="header">
							<div class="title">{{ item.title }}</div>
						</div>
						<div class="content">{{ item.content }}</div>
						<div class="tag-box">
							<div class="tag" v-for="(val, idx) in item.tagList" :key="idx">{{ val }}</div>
						</div>
					</div>
				</div>
			</div>
			<div class="left-footer">
				<div class="info">
					{{ `共 ` + total + ` 项` }}
				</div>
				<div class="page-box">
					<el-pagination background layout="prev, pager, next" :total="total" v-model:current-page="currentPage"
						@current-change="handleGetDynamics" />
				</div>
			</div>
		</div>
		<div class="rightcontent">
			<div class="right box">
				<div class="box-header">
					<div class="header-left"></div>
					<div class="title">基本信息</div>
					<div class="header-right">
						<div class="icon">
							<img src="@/assets/icons/box-header-icon2.png" alt="" />
						</div>
						<div class="icon">
							<img src="@/assets/icons/box-header-icon3.png" alt="" />
						</div>
					</div>
				</div>
				<div class="right-main">
					<div class="img-box">
						<img :src="basicInfo.logoUrl" alt="" />
					</div>
					<div class="info-box">
						<div class="info-item">
							<div class="info-item-left">{{ "成立时间：" }}</div>
							<div class="info-item-right">{{ basicInfo.establishmentDate }}</div>
						</div>
						<div class="info-item">
							<div class="info-item-left">{{ "总部地址：" }}</div>
							<div class="info-item-right">{{ basicInfo.address }}</div>
						</div>
						<div class="info-item">
							<div class="info-item-left">{{ "组织性质：" }}</div>
							<div class="info-item-right">{{ basicInfo.companyType }}</div>
						</div>
						<div class="info-item">
							<div class="info-item-left">{{ "在校人数：" }}</div>
							<div class="info-item-right">{{ basicInfo.numberOfEmployees }}</div>
						</div>
						<div class="info-item">
							<div class="info-item-left">{{ "教职工数：" }}</div>
							<div class="info-item-right">{{ basicInfo.teaNum }}</div>
						</div>
						<div class="info-item">
							<div class="info-item-left">{{ "QS排名：" }}</div>
							<div class="info-item-right">{{ basicInfo.rate }}</div>
						</div>

						<div class="info-item">
							<div class="info-item-left">{{ "QS排名：" }}</div>
							<div class="taglist">
								<div class="tagdirec" v-for="item in basicInfo.tag">{{ item }}</div>
							</div>
						</div>
					</div>
					<div class="user-box">
						<div class="user-header">
							{{ "重点人物：" }}
						</div>
						<div class="user-content">
							<div class="user-item" v-for="(item, index) in personList" :key="index">
								<div class="user-item-left">
									<img :src="item.avatarUrl" alt="" />
								</div>
								<div class="user-item-right">
									<div class="name">{{ item.name }}</div>
									<div class="position">{{ item.position }}</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="right-Num">
				<div class="numbox" v-for="item in awardsList">
					<div class="iconrec"></div>
					<div class="awards">{{ item.name }}</div>
					<div class="awardsNum">{{ item.num }}</div>
				</div>
			</div>
			<div class="right-history">
				<div class="box-header">
					<div class="header-left"></div>
					<div class="title">历史时间轴</div>
					<div class="header-right">
						<div class="icon">
							<img src="@/assets/icons/box-header-icon2.png" alt="" />
						</div>
						<div class="icon">
							<img src="@/assets/icons/box-header-icon3.png" alt="" />
						</div>
					</div>
				</div>
				<div class="historytimeline">
					<div class="timeline"></div>
					<div class="historyList">
						<div class="historyPoint" v-for="item in historyList">
							<div class="historytime">{{ item.createTime }}</div>
							<img src="./assets/images/timepoint.png" alt="" style="z-index: 2;" />
							<div class="historyitem">{{ item.content }}</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>

<script setup>
import { ref, computed, onMounted } from "vue";
import { useRouter } from "vue-router";
import {
	getDynamics,
	getInfo,
	getEventList,
	getPersonList
} from "@/api/innovationSubject/overview.js";
import Img from "./assets/images/img.png";
import User1 from "./assets/images/user1.png";
import User2 from "./assets/images/user2.png";
import User3 from "./assets/images/user3.png";
import User4 from "./assets/images/user4.png";

const router = useRouter();
//只看涉华动态
const cRelated = ref(false)
const dynamicsType = ref('org')
const basicInfo = ref({
	image: Img,
	shijian: "1636年",
	dizhi: "剑桥市，马萨诸塞州，美国",
	xingzhi: "私立研究型大学",
	stuNum: "约22,000人",
	teaNum: "约2,400人",
	rate: "#1",
	tag: ["癌症精准医疗", "气候变化解决方案", "人工智能伦理", "可持续发展能源"],
	keyUser: [
		{
			name: "艾伦·M·加伯",
			img: User1,
			position: "第30任校长"
		},
		{
			name: "迈克尔·桑德尔",
			img: User2,
			position: "政府学教授"
		},
		{
			name: "拉凯什·库拉纳",
			img: User3,
			position: "哈佛学院院长"
		},
		{
			name: "乔治·丘奇",
			img: User4,
			position: "哈佛医学院遗传学教授"
		}
	]
});

const curList = ref([
	{
		title: "哈佛大学再遭电话钓鱼攻击致数据泄露",
		time: "2025",
		date: "10月10日",
		content:
			"一名未授权人员通过社会工程手段入侵校友数据库，泄露联系方式、捐赠记录等信息。这是该校2025年内第二次重大数据泄露。",
		tagList: ["数据泄露"]
	},
	{
		title: "哈佛医学院发生爆炸，警方认定系蓄意制造",
		time: "2025 ",
		date: "10月4日",
		content:
			"202年11月1日凌晨2:48，哈佛医学院一栋教学楼四层发生爆炸，无人伤亡。波士顿警方公布两名戴面罩嫌疑人监控画面，FBI介入调查。",
		tagList: ["恐怖袭击"]
	},
	{
		title: "常春藤盟校联合加强网络安全联盟",
		time: "2025 ",
		date: "9月29日",
		content:
			"哈佛与普林斯顿、耶鲁、哥伦比亚等校宣布成立“常春藤网络安全协作体”，应对日益频繁的高校网络攻击。哈佛与普林斯顿、耶鲁、哥伦比亚等校宣布成立“常春藤网络安全协作体”。",
		tagList: ["生物科技"]
	},
	{
		title: "哈佛校长克劳丁·盖伊因学术诚信争议辞职",
		time: "2025 ",
		date: "9月21日",
		content:
			"首位非裔女校长克劳丁·盖伊（Claudine Gay）因多篇论文涉嫌抄袭及国会听证会上言论引发舆论风暴，上任不足一年即辞职。",
		tagList: ["先进制造"]
	},
	{
		title: "艾伦·M·加伯接任临时校长",
		time: "2025 ",
		date: "9月15日",
		content:
			"原教务长艾伦·加伯（Alan M. Garber）出任哈佛第30任校长（临时），承诺恢复学术诚信与校园团结。原教务长艾伦·加伯（Alan M. Garber）出任哈佛第30任校长（临时），承诺恢复学术诚信与校园团结。",
		tagList: ["集成电路"]
	},
	{
		title: "联邦法官叫停特朗普政府“禁招国际学生”令",
		time: "2025 ",
		date: "9月11日",
		content:
			"2025年5月29日，马萨诸塞州联邦法院法官艾莉森·伯勒斯发布临时限制令，阻止国土安全部取消哈佛招收国际学生资质。法院认为政府行为缺乏程序正当性，可能对学校造成“不可逆损害”，允许哈佛继续接收持有效签证学生。",
		tagList: ["集成电路"]
	},
	{
		title: "特朗普政府要求哈佛30天内提交“改革证据”",
		time: "2025 ",
		date: "9月10日",
		content:
			"2025年5月底，美国司法部致函哈佛，给予30天期限说明为何不应撤销其国际招生资质。此前政府指责哈佛“营造反犹环境”并拒绝提供学生名单。此举被视为强硬立场软化后的策略调整。",
		tagList: ["人工智能"]
	},
	{
		title: "哈佛2025届毕业典礼成政治声援现场",
		time: "2025 ",
		date: "9月1日",
		content:
			"在阴云密布的天空下，约3万师生家长齐聚哈佛第374届毕业典礼。众多毕业生佩戴白花声援国际学生，校长艾伦·加伯致辞强调“哈佛属于世界”，全场起立鼓掌逾一分钟，场面感人。",
		tagList: ["集成电路"]
	},
	{
		title: "哈佛教授警告：国际博士生面临系统性驱逐风险",
		time: "2025 ",
		date: "8月25日",
		content: "多位哈佛教授联名发声，指当前政策使90%以上国际博士生陷入签证不确定性，恐导致人才外流。",
		tagList: ["能源", "先进制造"]
	},
	{
		title: "巴以冲突激化哈佛校园对立",
		time: "2025 ",
		date: "8月19日",
		content:
			"2023年10月，亲巴勒斯坦与亲以色列学生团体在校园多次激烈对峙，部分活动演变为肢体冲突。校方因初期回应迟缓遭多方批评，后成立特别工作组调解矛盾。",
		tagList: ["先进制造"]
	},
	{
		title: "联邦法院裁定哈佛招生不构成种族歧视",
		time: "2025 ",
		date: "8月19日",
		content:
			"2022年8月，马萨诸塞州地方法院驳回“学生公平录取组织”诉讼，认为哈佛在本科招生中审慎考虑种族因素以促进多样性，符合现行法律框架。",
		tagList: ["先进制造"]
	},
	{
		title: "哈佛捐赠基金规模达509亿美元，全球第一",
		time: "2025 ",
		date: "8月19日",
		content:
			"2023财年报告显示，尽管市场波动，哈佛管理公司（HMC）仍维持全球最大高校捐赠基金地位，为教学、科研与助学提供坚实财务支撑。",
		tagList: ["先进制造"]
	}
]);

const changedynamicsType = () => {
	dynamicsType.value === 'person' ? dynamicsType.value = 'org' : dynamicsType.value = 'person'
	handleGetDynamics()
}

const handleGetInfo = async () => {
	try {
		let params = {
			id: router.currentRoute._value.params.id
		}
		const res = await getInfo(params);
		console.log("创新主体基本信息", res);
		if (res.code === 200 && res.data) {
			basicInfo.value = res.data
		}
	} catch (error) {
		console.error("获取基本信息error", error);
	}
};
const personList = ref([])
//重点人物
const handleGetPersonList = async () => {
	try {
		let params = {
			id: router.currentRoute._value.params.id
		}
		const res = await getPersonList(params);
		console.log("重点人物", res);
		if (res.code === 200 && res.data) {
			personList.value = res.data
		}
	} catch (error) {
		console.error("获取重点人物error", error);
	}
};

const total = ref(0)
const currentPage = ref(1)
const handleGetDynamics = async () => {
	try {
		let params = {
			currentPage: 1,
			pageSize: 10,
			cRelated: cRelated.value ? null : 'N',
			dynamicsType: dynamicsType.value,
			orgId: router.currentRoute._value.params.id
		}
		const res = await getDynamics(params);
		console.log("创新主体最新动态", res);
		if (res.code === 200 && res.data) {
			curList.value = res.data.content
			total.value = res.data.totalElements
		}
	} catch (error) {
		console.error("获取最新动态error", error);
	}
};
const awardsList = ref([
	{
		name: "诺贝尔奖",
		num: 161
	},
	{
		name: "图灵奖",
		num: 18
	},
	{
		name: "菲尔兹奖",
		num: 14
	},
	{
		name: "美国院士",
		num: 273
	}
]);
const historyList = ref([
	{
		time: "2023年",
		event: "克劳丁·盖伊成为首位非裔女校长"
	},
	{
		time: "1999年",
		event: "拉德克利夫学院转型为“拉德克利夫高等研究院”"
	},
	{
		time: "1977年",
		event: "哈佛与拉德克利夫学院正式合并招生"
	},
	{
		time: "1950年",
		event: "逐步废除招生中的宗教、种族限制，学生群体多元化"
	},
	{
		time: "1908年",
		event: "哈佛商学院成立，首创MBA案例教学法"
	},
	{
		time: "1869年",
		event: "查尔斯·W·艾略特任校长40年，推行选修制、重建法学院、改革医学院、新建商学院等"
	}
]);

const handleGetEventList = async () => {
	try {
		let params = {
			id: router.currentRoute._value.params.id
		}
		const res = await getEventList(params);
		console.log("历史动态", res);
		if (res.code === 200 && res.data) {
			historyList.value = res.data
		}
	} catch (error) {
		console.error("获取历史动态error", error);
	}
};
onMounted(async () => {
	handleGetInfo()
	handleGetDynamics()
	handleGetEventList()
	handleGetPersonList()
});
</script>

<style lang="scss" scoped>
.detail-wrap {
	display: flex;
	gap: 16px;
	padding-bottom: 30px;

	.box {
		border: 1px solid rgba(234, 236, 238, 1);
		border-radius: 10px;
		box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
		background: rgba(255, 255, 255, 1);
	}

	.box-header {
		height: 56px;
		display: flex;
		position: relative;

		.header-left {
			margin-top: 18px;
			width: 8px;
			height: 20px;
			border-radius: 0 4px 4px 0;
			background: rgba(10, 87, 166, 1);
		}

		.title {
			margin-left: 14px;
			margin-top: 14px;
			color: rgba(5, 95, 194, 1);
			font-family: Microsoft YaHei;
			font-size: 20px;
			font-weight: 700;
			line-height: 26px;
			letter-spacing: 0px;
			text-align: left;
		}

		.header-btn-box {
			position: absolute;
			top: 14px;
			right: 52px;
			display: flex;

			.btn {
				margin-left: 8px;
				height: 28px;
				padding: 0 8px;
				box-sizing: border-box;
				border: 1px solid rgba(230, 231, 232, 1);
				border-radius: 4px;
				background: rgba(255, 255, 255, 1);
				text-align: center;
				line-height: 28px;
				color: rgba(59, 65, 75, 1);
				font-family: Microsoft YaHei;
				font-size: 16px;
				font-weight: 400;
				cursor: pointer;
			}

			.btnActive {
				border: 1px solid rgba(10, 87, 166, 1);
				background: rgba(246, 250, 255, 1);
				color: rgba(10, 87, 166, 1);
			}
		}

		.header-info {
			height: 22px;
			position: absolute;
			right: 84px;
			top: 17px;
			display: flex;
			justify-content: flex-end;

			.icon {
				margin-top: 3px;
				width: 14px;
				height: 14px;
				margin-right: 8px;

				img {
					width: 100%;
					height: 100%;
				}
			}

			.text {
				height: 22px;
				color: rgba(95, 101, 108, 1);
				font-family: Microsoft YaHei;
				font-size: 14px;
				font-weight: 400;
				line-height: 22px;
			}
		}

		.header-right {
			position: absolute;
			top: 14px;
			right: 12px;
			display: flex;
			justify-content: flex-end;
			gap: 8px;

			.icon {
				width: 28px;
				height: 28px;

				img {
					width: 100%;
					height: 100%;
				}
			}

			.checkboxRight {
				color: rgba(132, 136, 142, 1);
				font-family: Microsoft YaHei;
				font-size: 16px;
				font-weight: 400;
				line-height: 24px;
				letter-spacing: 0px;
				text-align: justify;
			}

			.btnRightActive {
				width: 80px;
				height: 28px;
				display: flex;
				flex-direction: row;
				justify-content: center;
				align-items: center;
				box-sizing: border-box;
				border: 1px solid rgba(5, 95, 194, 1);
				border-radius: 4px;
				background: rgba(231, 243, 255, 1);
				color: rgba(5, 95, 194, 1);
				font-family: Microsoft YaHei;
				font-size: 16px;
				font-weight: 400;
				line-height: 30px;
				letter-spacing: 0px;
				text-align: center;
			}

			.btnRight {
				width: 80px;
				height: 28px;
				display: flex;
				flex-direction: row;
				justify-content: center;
				align-items: center;
				box-sizing: border-box;
				border: 1px solid rgba(230, 231, 232, 1);
				border-radius: 4px;
				background: rgba(255, 255, 255, 1);
				color: rgba(59, 65, 75, 1);
				font-family: Microsoft YaHei;
				font-size: 16px;
				font-weight: 400;
				line-height: 30px;
				letter-spacing: 0px;
				text-align: center;
			}
		}
	}

	.left {
		width: 1064px;
		height: 2083px;

		.left-main {
			border-top: 1px solid rgba(234, 236, 238, 1);
			height: 1905px;

			.left-main-item {
				display: flex;
				margin-top: 20px;
				gap: 18px;
				margin-left: 31px;
				height: 130px;
				position: relative;

				.line {
					background: #e6e7e8;
					width: 2px;
					height: 132px;
					position: absolute;
					top: 24px;
					left: 106px;
				}

				.time {
					display: flex;
					flex-direction: column;

					.timetext {
						width: 79px;
						color: rgba(5, 95, 194, 1);
						font-family: Microsoft YaHei;
						font-size: 16px;
						font-weight: 700;
						line-height: 24px;
						letter-spacing: 1px;
						text-align: right;
					}
				}

				.icon {
					width: 24px;
					height: 24px;

					img {
						width: 100%;
						height: 100%;
					}
				}

				.info {
					width: 862px;

					.header {
						height: 26px;
						display: flex;
						justify-content: space-between;

						.title {
							color: rgba(59, 65, 75, 1);
							font-family: Microsoft YaHei;
							font-size: 20px;
							font-weight: 700;
							line-height: 26px;
						}
					}

					.content {
						display: -webkit-box;
						-webkit-line-clamp: 2;
						/* 限制显示两行 */
						-webkit-box-orient: vertical;
						/* 垂直排列内容 */
						overflow: hidden;
						/* 隐藏超出部分 */
						text-overflow: ellipsis;
						/* 显示省略号 */
						/* Text */
						width: 862px;
						height: 48px;
						margin-top: 8px;
						color: rgba(95, 101, 108, 1);
						font-family: Microsoft YaHei;
						font-size: 16px;
						font-weight: 400;
						line-height: 24px;
					}

					.tag-box {
						margin-top: 12px;
						display: flex;
						gap: 8px;

						.tag {
							height: 28px;
							padding: 0 8px;
							line-height: 28px;
							border-radius: 4px;
							background: rgba(231, 243, 255, 1);
							color: rgba(5, 95, 194, 1);
							font-family: Microsoft YaHei;
							font-size: 14px;
							font-weight: 400;
						}
					}
				}
			}
		}

		.left-footer {
			height: 75px;
			border-top: 1px solid rgba(234, 236, 238, 1);
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 0 20px;
		}
	}

	.rightcontent {
		display: flex;
		flex-direction: column;
		width: 520px;
		gap: 16px;

		.right {
			width: 520px;
			height: 874px;

			.right-main {
				width: 469px;
				margin: 3px auto;

				.img-box {
					width: 469px;
					height: 240px;

					img {
						width: 100%;
						height: 100%;
					}
				}

				.info-box {
					margin-top: 26px;
					padding-bottom: 50px;
					border-bottom: 1px solid rgba(234, 236, 238, 1);

					.info-item {
						display: flex;
						margin-top: 12px;

						.info-item-left {
							width: 88px;
							height: 24px;
							color: rgba(59, 65, 75, 1);
							font-family: Microsoft YaHei;
							font-size: 16px;
							font-weight: 700;
							line-height: 24px;
							letter-spacing: 1px;
							text-align: left;
						}

						.info-item-right {
							width: 356px;
							color: rgba(59, 65, 75, 1);
							font-family: Microsoft YaHei;
							font-size: 16px;
							font-weight: 400;
							line-height: 24px;
							letter-spacing: 0px;
							text-align: left;
						}

						.taglist {
							width: 358px;
							display: flex;
							gap: 8px;
							flex-wrap: wrap;

							.tagdirec {
								height: 24px;
								justify-content: center;
								align-items: center;
								padding: 1px 8px 1px 8px;
								box-sizing: border-box;
								border: 1px solid rgba(186, 224, 255, 1);
								border-radius: 4px;
								background: rgba(230, 244, 255, 1);
								color: rgba(22, 119, 255, 1);
								font-family: Microsoft YaHei;
								font-size: 14px;
								font-weight: 400;
								line-height: 20px;
								letter-spacing: 0px;
								text-align: left;
							}
						}
					}
				}

				.user-box {
					padding-top: 19px;

					.user-header {
						height: 24px;
						color: rgba(59, 65, 75, 1);
						font-family: Microsoft YaHei;
						font-size: 16px;
						font-weight: 700;
						line-height: 24px;
						letter-spacing: 1px;
						text-align: left;
					}

					.user-content {
						margin-top: 19px;
						display: flex;
						flex-wrap: wrap;
						gap: 16px 73px;
						justify-content: start;

						.user-item {
							height: 49px;
							display: flex;
							gap: 8px;

							.user-item-left {
								width: 48px;
								height: 48px;

								img {
									width: 100%;
									height: 100%;
								}
							}

							.user-item-right {
								.name {
									height: 24px;
									color: rgba(59, 65, 75, 1);
									font-family: Microsoft YaHei;
									font-size: 16px;
									font-weight: 700;
									line-height: 24px;
									letter-spacing: 0px;
									text-align: left;
								}

								.position {
									height: 24px;
									color: rgba(95, 101, 108, 1);
									font-family: Microsoft YaHei;
									font-size: 16px;
									font-weight: 400;
									line-height: 24px;
									letter-spacing: 0px;
									text-align: left;
								}
							}
						}
					}
				}
			}
		}

		.right-Num {
			display: flex;
			flex-wrap: wrap;
			width: 520px;
			gap: 8px;

			.numbox {
				display: flex;
				width: 256px;
				height: 80px;
				box-sizing: border-box;
				border: 1px solid rgba(234, 236, 238, 1);
				border-radius: 10px;
				box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
				background: rgba(255, 255, 255, 1);
				align-items: center;

				.iconrec {
					width: 4px;
					height: 49px;
					background: rgba(5, 95, 194, 1);
				}

				.awards {
					margin-left: 24px;
					color: rgba(59, 65, 75, 1);
					font-family: Microsoft YaHei;
					font-size: 20px;
					font-weight: 700;
					line-height: 26px;
					letter-spacing: 0px;
					text-align: left;
				}

				.awardsNum {
					margin-left: 72px;
					color: rgba(5, 95, 194, 1);
					font-family: Microsoft YaHei;
					font-size: 30px;
					font-weight: 700;
					line-height: 24px;
					letter-spacing: 0px;
					text-align: right;
				}
			}
		}

		.right-history {
			width: 520px;
			height: 1009px;
			border: 1px solid rgba(234, 236, 238, 1);
			border-radius: 10px;
			/* 业务系统/模块阴影 */
			box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
			background: rgba(255, 255, 255, 1);

			.historytimeline {
				display: flex;
				margin-left: 37px;
				margin-top: 29px;

				.timeline {
					position: absolute;
					width: 8px;
					height: 910px;
					background: url("./assets/images/arrow.png") repeat;

				}

				.historyList {

					margin-left: -2px;
					display: flex;
					flex-direction: column;
					margin-top: 42px;
					gap: 56px;

					.historyPoint {
						width: 458px;
						height: 89px;
						gap: 6px;

						.historytime {
							margin-left: 24px;
							color: rgba(5, 95, 194, 1);
							font-family: Microsoft YaHei;
							font-size: 16px;
							font-weight: 700;
							line-height: 24px;
							letter-spacing: 1px;
							text-align: left;
						}

						.historyitem {
							margin-left: 24px;
							color: rgba(59, 65, 75, 1);
							font-family: Microsoft YaHei;
							font-size: 16px;
							font-weight: 400;
							line-height: 24px;
							letter-spacing: 0px;
							text-align: justify;
						}
					}
				}
			}
		}
	}
}




::v-deep .el-checkbox__label {
	color: rgba(132, 136, 142, 1);
	font-family: Microsoft YaHei;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	padding-left: 3px;
	padding-right: 10px;
}
</style>