报告分析-核心观点、风险提示

src/api/thinkTank/overview.js

@@ -258,6 +258,21 @@ export function getThinkTankReportContent(params) {
   })
 }
 
+// 获取报告核心论点（支持关键字搜索）
+export function getThinkTankReportViewpoint(params) {
+  const { reportId, currentPage, pageSize, keyword = '', orgIds = '' } = params
+  return request({
+    method: 'GET',
+    url: `/api/thinkTankReport/viewpoint/${reportId}`,
+    params: {
+      currentPage,
+      pageSize,
+      keyword,
+      orgIds,
+    }
+  })
+}
+
 //获取涉及科技领域
 export function getThinkTankReportIndustry(params) {
   return request({

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

 <template>
 	<div class="wrap">
+		<div class="top">
+			<WarningPane :warnningLevel="riskSignal?.level" :warnningContent="riskSignal?.content">
+			</WarningPane>
+		</div>
+		<div class="bottom-row">
 			<div class="left">
 				<div class="box1">
 					<!-- <div class="box-header">
@@ -117,19 +122,36 @@
 				</div>
 				<div class="box4">
 					<AnalysisBox title="核心论点" :showAllBtn="true">
+						<div class="search-box">
+							<el-input placeholder="搜索观点" v-model="searchOpinions" style="width: 180px"
+								@keyup.enter="handleSearchOpinions" />
+							<div class="icon">
+								<img src="../images/Line_Search.png" alt="" @click="handleSearchOpinions" />
+							</div>
+						</div>
 						<div class="box4-main">
 							<div class="box4-main-main">
-							<div class="box4-item" v-for="(item, index) in majorOpinions" :key="index">
+								<div class="box4-item" v-for="(item, index) in filteredOpinions" :key="index">
+									<div class="top-row">
 										<div class="left">
 											{{ index + 1 }}
 										</div>
 										<div class="center">
-									<div class="title">{{ item.content }}</div>
+											<div class="title">{{ item.titleZh }}</div>
 											<div>
 												<img src="../images/image-open.png" alt="" class="center-image"
 													@click="handleOpenReportOriginal(item)" />
 											</div>
-									<!-- <div class="desc">{{ item.econtent }}</div> -->
+											<div>
+												<img v-if="expandedIndex !== index" src="../images/image-down.png" alt="" class="center-image"
+													@click="toggleOpinion(index)" />
+												<img v-else src="../images/image-up.png" alt="" class="center-image"
+													@click="toggleOpinion(index)" />
+											</div>
+										</div>
+									</div>
+									<div v-if="expandedIndex === index" class="desc">
+										{{ item.contentZh }}
 									</div>
 									<!-- <div class="right"> -->
 									<!-- <div class="tag" v-for="(val, idx) in item.hylyList" :key="idx">
@@ -146,9 +168,9 @@
 								</div>
 							</div>
 							<div class="box4-main-footer">
-							<div class="info">共{{ total }}条核心论点</div>
+								<div class="info">共{{ opinionsTotal }}条核心论点</div>
 								<div class="page-box">
-								<el-pagination :page-size="12" background layout="prev, pager, next" :total="total"
+									<el-pagination :page-size="pageSize" background layout="prev, pager, next" :total="opinionsTotal"
 										@current-change="handleCurrentChange" :current-page="currentPage" />
 								</div>
 							</div>
@@ -157,9 +179,12 @@
 				</div>
 			</div>
 		</div>
+	</div>
 </template>
 
 <script setup>
+import WarningPane from "@/components/base/WarningPane/index.vue"
+import SearchContainer from "@/components/SearchContainer.vue";
 import { ref, onMounted, computed, defineProps } from "vue";
 import setChart from "@/utils/setChart";
 import getWordCloudChart from "./utils/worldCloudChart";
@@ -167,7 +192,8 @@ import {
 	getThinkTankReportAbstract,
 	getThinkTankReportContent,
 	getThinkTankReportIndustry,
-	getThinkTankReportIndustryCloud
+	getThinkTankReportIndustryCloud,
+	getThinkTankReportViewpoint
 } from "@/api/thinkTank/overview";
 import { getChartAnalysis } from "@/api/aiAnalysis/index";
 import { useRouter } from "vue-router";
@@ -185,6 +211,28 @@ const props = defineProps({
 	}
 });
 
+const searchOpinions = ref('');
+
+const handleSearchOpinions = () => {
+	currentPage.value = 1;
+	handleGetThinkTankReportViewpoint();
+};
+
+// 当前展开的核心论点下标（同一时刻只展开一条）
+const expandedIndex = ref(null);
+
+const filteredOpinions = computed(() => majorOpinions.value);
+
+const opinionsTotal = computed(() => total.value);
+
+const toggleOpinion = index => {
+	if (expandedIndex.value === index) {
+		expandedIndex.value = null;
+	} else {
+		expandedIndex.value = index;
+	}
+};
+
 const publishTime = computed(() => {
 	const info = props.thinkInfo || {};
 	// 优先用 times，其次用 reportTime 的日期部分
@@ -207,6 +255,11 @@ const reportAuthors = computed(() => {
 	}
 	return [];
 });
+const riskSignal = computed(() => {
+	const info = props.thinkInfo || {};
+	return info.riskSignal;
+
+});
 
 
 // 内容摘要
@@ -362,22 +415,27 @@ const pageSize = ref(10);
 const total = ref(0);
 const handleCurrentChange = page => {
 	currentPage.value = page;
-	handleGetThinkTankReportContent();
+	handleGetThinkTankReportViewpoint();
 };
-//获取报告主要观点
-const handleGetThinkTankReportContent = async () => {
+
+// 获取报告核心论点（支持搜索）
+const handleGetThinkTankReportViewpoint = async () => {
 	try {
 		const params = {
-			id: router.currentRoute._value.params.id,
+			reportId: router.currentRoute._value.params.id,
 			currentPage: currentPage.value - 1,
-			pageSize: pageSize.value
+			pageSize: pageSize.value,
+			keyword: (searchOpinions.value || "").trim(),
+			orgIds: ""
 		};
-		const res = await getThinkTankReportContent(params);
-		console.log("主要观点", res.data);
+		const res = await getThinkTankReportViewpoint(params);
+		console.log("核心论点", res.data);
 		if (res.code === 200 && res.data) {
 			majorOpinions.value = res.data.content || [];
-			handleGetBox3AnalysisContent(majorOpinions.value);
+
 			total.value = res.data.totalElements || 0;
+			// 重置展开状态
+			expandedIndex.value = null;
 		}
 	} catch (error) {
 		console.error("获取主要观点error", error);
@@ -396,7 +454,7 @@ const handleGetBox3AnalysisContent = async textJson => {
 
 onMounted(() => {
 	handleGetThinkTankReportAbstract();
-	handleGetThinkTankReportContent();
+	handleGetThinkTankReportViewpoint();
 	handleGetThinkTankReportIndustry();
 
 	handleGetThinkTankReportIndustryCloud();
@@ -409,79 +467,23 @@ onMounted(() => {
 	justify-content: center;
 	gap: 16px;
 	padding-bottom: 16px;
+	flex-direction: column;
 
-	.box-header {
+	.top {
+		margin-top: 16px;
 		width: 100%;
-		height: 50px;
-		display: flex;
-		position: relative;
-
-		.header-left {
-			margin-top: 18px;
-			width: 8px;
-			height: 20px;
-			border-radius: 0 4px 4px 0;
-			background: var(--color-main-active);
-		}
-
-		.title {
-			margin-left: 14px;
-			margin-top: 14px;
-			height: 26px;
-			line-height: 26px;
-			color: var(--color-main-active);
-			font-family: Microsoft YaHei;
-			font-size: 20px;
-			font-weight: 700;
-		}
-
-		.header-btn-box {
-			position: absolute;
-			top: 15px;
-			right: 83px;
+		height: 100%;
+		justify-content: center;
 		display: flex;
-			justify-content: flex-end;
-			gap: 8px;
-
-			.btn {
-				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);
-				color: rgba(59, 65, 75, 1);
-				font-family: Microsoft YaHei;
-				font-size: 16px;
-				font-weight: 400;
-				line-height: 28px;
 	}
 
-			.btnActive {
-				color: var(--color-main-active);
-				border: 1px solid var(--color-main-active);
-			}
-		}
+	.bottom-row {
 
-		.header-right {
-			position: absolute;
-			top: 14px;
-			right: 12px;
+		flex-direction: row;
+		justify-content: center;
 		display: flex;
-			justify-content: flex-end;
-			gap: 4px;
+		gap: 16px;
 
-			.icon {
-				width: 28px;
-				height: 28px;
-
-				img {
-					width: 100%;
-					height: 100%;
-				}
-			}
-		}
-	}
 
 		.left {
 			gap: 16px;
@@ -881,6 +883,38 @@ onMounted(() => {
 				// background: rgba(255, 255, 255, 1);
 				position: relative;
 
+				.search-box {
+					display: flex;
+					width: 180px;
+					height: 32px;
+					box-sizing: border-box;
+					border: 1px solid rgba(230, 231, 232, 1);
+					border-radius: 4px;
+					background: rgba(255, 255, 255, 1);
+					position: relative;
+					margin-top: 3px;
+					margin-bottom: 16px;
+					margin-left: 23px;
+
+					.icon {
+						width: 16px;
+						height: 16px;
+
+						cursor: pointer;
+						position: absolute;
+						right: 8px;
+						top: 8px;
+
+						display: flex;
+						justify-content: flex-end;
+
+						img {
+							width: 100%;
+							height: 100%;
+						}
+					}
+				}
+
 				.box4-main {
 					width: 1057px;
 
@@ -892,12 +926,17 @@ onMounted(() => {
 
 						.box4-item {
 							width: 1057px;
-						height: 72px;
 							box-sizing: border-box;
 							border-radius: 4px;
 							display: flex;
+							flex-direction: column;
 							position: relative;
 
+							.top-row {
+								display: flex;
+								align-items: flex-start;
+							}
+
 							.left {
 								margin-top: 24px;
 								margin-left: 15px;
@@ -915,8 +954,8 @@ onMounted(() => {
 							}
 
 							.center {
-							height: 64px;
-							width: 910px;
+								min-height: 64px;
+
 								margin-left: 13px;
 								display: flex;
 								align-items: center;
@@ -993,6 +1032,22 @@ onMounted(() => {
 									height: 100%;
 								}
 							}
+
+							.desc {
+								width: 950px;
+								margin-top: 22px;
+								margin-left: 52px; // 24(left) + 13(center margin) + 一点间距
+
+								color: rgb(59, 65, 75);
+								font-family: "Source Han Sans CN";
+								font-weight: 400;
+								/* Regular 常规 */
+								font-size: 16px;
+								line-height: 30px;
+								letter-spacing: 0px;
+								text-align: justify;
+								/* 两端对齐 */
+							}
 						}
 
 						.box4-item {
@@ -1069,6 +1124,7 @@ onMounted(() => {
 				}
 			}
 		}
+	}
 }
 
 :deep(.analysis-box-wrapper .wrapper-header) {