智库样式优化

src/api/thinkTank/overview.js

@@ -141,6 +141,7 @@ export function getThinkPolicy(params) {
   return request({
     method: 'GET',
     url: `/api/thinkTankInfo/policy/${params.id}/${params.startDate}`,
+    params
   })
 }
 

src/views/thinkTank/ReportDetail/policyTracking/index.vue

@@ -431,7 +431,8 @@ onMounted(async () => {
 				width: 1056px;
 				height: 1280px;
 				margin: 0 auto;
-				overflow: auto;
+				overflow: hidden;
+				overflow-y: auto;
 
 				.box1-item {
 					height: 128px;
@@ -456,6 +457,7 @@ onMounted(async () => {
 					}
 
 					.center {
+						width: 850px;
 						margin-left: 18px;
 
 						.title {

src/views/thinkTank/ReportDetail/reportAnalysis/index.vue

@@ -39,8 +39,13 @@
 				</div>
 				<div class="box2-main">
 					<div class="box2-main-tag-box">
-						<div class="tag" :class="{ tagActive: activeArea === item }" v-for="(item, index) in areaList" :key="index"
-							@click="handleClickArea(item.status)">
+						<div
+							class="tag"
+							:class="{ tagActive: activeArea === item }"
+							v-for="(item, index) in areaList"
+							:key="index"
+							@click="handleClickArea(item.status)"
+						>
 							{{ item.industryName }}
 						</div>
 					</div>
@@ -94,13 +99,16 @@
 						</div>
 					</div>
 					<div class="box3-main-footer">
-						<div class="info">
-
-							共{{ total }}项调查
-						</div>
+						<div class="info">共{{ total }}项调查</div>
 						<div class="page-box">
-							<el-pagination :page-size="12" background layout="prev, pager, next" :total="total"
-								@current-change="handleCurrentChange" :current-page="currentPage" />
+							<el-pagination
+								:page-size="12"
+								background
+								layout="prev, pager, next"
+								:total="total"
+								@current-change="handleCurrentChange"
+								:current-page="currentPage"
+							/>
 						</div>
 					</div>
 				</div>
@@ -131,7 +139,6 @@ import {
 	getThinkTankReportContent,
 	getThinkTankReportIndustry,
 	getThinkTankReportIndustryCloud
-
 } from "@/api/thinkTank/overview";
 import { useRouter } from "vue-router";
 const router = useRouter();
@@ -141,27 +148,25 @@ const box1Data =
 	ref(`包括经济竞争在内的美中竞争自2017年以来一直在定义美国外交政策。这两个经济体是世界上第一和第二大国家经济体,并且深深交织在一起。改变关系,无论多么必要,可能是昂贵的。因此,美国面临着一项挑战,确保其经济在耦合的战略竞争条件下满足国家的需求。
        为了应对这一挑战,兰德大学的研究人员对美中竞争进行了经济和制度分析,进行了参与式的远见练习,以了解确保美国经济健康的长期路径,并创建了两个经济竞争游戏,探索多个国家在相互交流的同时确保经济健康的动态...`);
 
-
 //获取内容摘要
 const handleGetThinkTankReportAbstract = async () => {
 	try {
 		const res = await getThinkTankReportAbstract(router.currentRoute._value.params.id);
 		console.log("内容摘要", res);
 		if (res.code === 200 && res.data) {
-			box1Data.value = res.data
+			box1Data.value = res.data;
 		}
 	} catch (error) {
 		console.error("获取内容摘要error", error);
 	}
 };
 
-
 // 涉及科技领域
 const areaList = ref([]);
 const activeArea = ref(6);
 const handleClickArea = area => {
 	activeArea.value = area;
-	handleGetThinkTankReportIndustryCloud()
+	handleGetThinkTankReportIndustryCloud();
 };
 const box2Data = ref([
 	// {
@@ -204,21 +209,20 @@ const handleGetThinkTankReportIndustryCloud = async () => {
 		const params = {
 			id: router.currentRoute._value.params.id,
 			industryId: activeArea.value
-		}
+		};
 		const res = await getThinkTankReportIndustryCloud(params);
 		console.log("科技领域词云", res);
 		if (res.code === 200 && res.data) {
-			const data = []
+			const data = [];
 			res.data.map(item => {
-				data.push(
-					{
+				data.push({
 					name: item.clause,
 					value: item.count
-					})
-				box2Data.value = data
+				});
+				box2Data.value = data;
 				const box2Chart = getWordCloudChart(box2Data.value);
 				setChart(box2Chart, "box2Chart");
-			})
+			});
 		}
 	} catch (error) {
 		console.error("获取科技领域词云error", error);
@@ -230,7 +234,7 @@ const handleGetThinkTankReportIndustry = async () => {
 		const res = await getThinkTankReportIndustry(router.currentRoute._value.params.id);
 		console.log("涉及科技领域", res);
 		if (res.code === 200 && res.data) {
-			areaList.value = res.data
+			areaList.value = res.data;
 		}
 	} catch (error) {
 		console.error("获取涉及科技领域error", error);
@@ -378,10 +382,10 @@ const majorOpinions = ref([
 	}
 ]);
 // 处理页码改变事件
-const currentPage = ref(1)
+const currentPage = ref(1);
 const handleCurrentChange = page => {
 	currentPage.value = page;
-	handleGetThinkDynamicsReport()
+	handleGetThinkDynamicsReport();
 };
 //获取报告主要观点
 const handleGetThinkTankReportContent = async () => {
@@ -389,19 +393,18 @@ const handleGetThinkTankReportContent = async () => {
 		const res = await getThinkTankReportContent(router.currentRoute._value.params.id);
 		console.log("主要观点", res);
 		if (res.code === 200 && res.data) {
-			majorOpinions.value = res.data.content
+			majorOpinions.value = res.data.content;
 		}
 	} catch (error) {
 		console.error("获取主要观点error", error);
 	}
 };
 onMounted(() => {
-	handleGetThinkTankReportAbstract()
-	handleGetThinkTankReportContent()
-	handleGetThinkTankReportIndustry()
-
-	handleGetThinkTankReportIndustryCloud()
+	handleGetThinkTankReportAbstract();
+	handleGetThinkTankReportContent();
+	handleGetThinkTankReportIndustry();
 
+	handleGetThinkTankReportIndustryCloud();
 });
 </script>
 
@@ -506,14 +509,15 @@ onMounted(() => {
 				line-height: 30px;
 				letter-spacing: 0px;
 				text-align: justify;
-				display: -webkit-box;
-				/* 使用Webkit的弹性盒模型 */
-				-webkit-box-orient: vertical;
-				/* 垂直排列 */
-				-webkit-line-clamp: 9;
-				/* 限制显示9行 */
-				overflow: hidden;
-				/* 隐藏超出部分 */
+				overflow-y: auto;
+				// display: -webkit-box;
+				// /* 使用Webkit的弹性盒模型 */
+				// -webkit-box-orient: vertical;
+				// /* 垂直排列 */
+				// -webkit-line-clamp: 9;
+				// /* 限制显示9行 */
+				// overflow: hidden;
+				// /* 隐藏超出部分 */
 			}
 
 			.box1-footer {
@@ -667,6 +671,9 @@ onMounted(() => {
 								line-height: 26px;
 								letter-spacing: 0px;
 								text-align: left;
+								overflow: hidden;
+								text-overflow: ellipsis;
+								white-space: nowrap;
 							}
 
 							.desc {
@@ -678,6 +685,9 @@ onMounted(() => {
 								line-height: 22px;
 								letter-spacing: 0px;
 								text-align: left;
+								overflow: hidden;
+								text-overflow: ellipsis;
+								white-space: nowrap;
 							}
 						}
 

src/views/thinkTank/ThinkTankDetail/index.vue

@@ -14,7 +14,7 @@
 						{{ thinkTank.describe }}
 					</div>
 					<div class="center-footer">
-						<div class="tag" v-for="tag in thinkTank.tags">{{ tag.industryName }}</div>
+						<div class="tag" v-for="tag,index in thinkTank.tags" :key="index">{{ tag.industryName }}</div>
 
 					</div>
 				</div>
@@ -114,7 +114,10 @@ onMounted(async () => {
 			.header-top-left {
 				width: 88px;
 				height: 88px;
-				background: purple;
+				img{
+					width: 100%;
+					height: 100%;
+				}
 			}
 
 			.header-top-center {

src/views/thinkTank/ThinkTankDetail/thinkDynamics/index.vue

@@ -14,7 +14,7 @@
 						<el-option @click="handleGetThinkDynamicsReport()" v-for="item in yearList" :key="item.value"
 							:label="item.label" :value="item.value" />
 					</el-select>
-					<el-select v-model="sort" placeholder="发布时间" style="width: 120px">
+					<el-select v-model="sort" placeholder="发布时间" style="width: 120px; margin-left: 8px;">
 						<el-option @click="handleGetThinkDynamicsReport()" :key="true" label="正序" :value="true" />
 						<el-option @click="handleGetThinkDynamicsReport()" :key="false" label="倒序" :value="false" />
 					</el-select>
@@ -490,6 +490,9 @@ onMounted(async () => {
 					font-size: 18px;
 					font-weight: 700;
 					line-height: 24px;
+					overflow: hidden;
+					text-overflow: ellipsis;
+					white-space: nowrap;
 				}
 
 				.footer-card-footer {

src/views/thinkTank/index.vue

@@ -1475,6 +1475,9 @@ onMounted(async () => {
 							font-weight: 400;
 							line-height: 32px;
 							letter-spacing: 0px;
+							overflow: hidden;
+							// text-overflow: ellipsis;
+							// white-space: nowrap;
 						}
 
 						.rank1 {