style 修改aipane和waringpane样式

src/components/SearchContainer.vue

@@ -10,8 +10,7 @@
 			</div>
 			<div
 				class="search-type-tab"
-				:class="{ active: billSearchType === 'state' }"
-				@click="handleChangeBillSearchType('state')"
+				:class="{ active: billSearchType === 'state', 'is-disabled': true }"
 			>
 				州议会
 			</div>
@@ -206,6 +205,11 @@ const handleToPosi = id => {
 			color: rgb(5, 95, 194);
 			border-color: rgb(255, 255, 255);
 		}
+
+		.search-type-tab.is-disabled {
+			cursor: not-allowed;
+			opacity: 0.6;
+		}
 	}
 
 	.search-main-with-tabs {

src/components/base/Ai/AiPane/index.vue

@@ -24,7 +24,8 @@ const props = defineProps({
 <style lang="scss">
 .ai-pane-wrapper {
   width: 100%;
-  height: 156px;
+  min-height: 156px;
+  height: auto;
   background: var(--color-primary-2);
   box-sizing: border-box;
   padding: 12px 16px;
@@ -57,18 +58,15 @@ const props = defineProps({
   .content {
     margin-top: 8px;
     width: 100%;
-    height: 90px;
+    min-height: 90px;
+    height: auto;
     box-sizing: border-box;
     padding: 0 12px;
     color: var(--color-primary-100);
-    display: -webkit-box;
-    -webkit-line-clamp: 3;
-    /* 控制显示的行数 */
-    -webkit-box-orient: vertical;
-    overflow: hidden;
-    text-overflow: ellipsis;
+    display: block;
+    overflow: visible;
     word-break: break-word;
-    /* 防止长单词溢出 */
+    white-space: pre-wrap;
   }
 }
 </style>
\ No newline at end of file

src/components/base/WarningPane/index.vue

 <template>
-  <div class="warnning-pane-wrapper" :style="{ width: width ? width : '1600px', height: height ? height : '116px' }"
+  <div class="warnning-pane-wrapper" :style="{ width: width ? width : '1600px', height: height ? height : 'auto', minHeight: height ? undefined : '116px' }"
     :class="{
       level1: warnningLevel === '特别重大风险',
       level2: warnningLevel === '重大风险',
@@ -146,15 +146,12 @@ const handleClickPane = () => {
 .warnning-pane-content{
   width: calc(100% - 40px);
   margin: 0 auto;
-  height: 60px;
-  display: -webkit-box;
-  /* 2. 设置内部布局方向为垂直 */
-  -webkit-box-orient: vertical;
-  /* 3. 限制显示的行数为 2 行 */
-  -webkit-line-clamp: 2;
-  /* 4. 隐藏超出部分 */
-  overflow: hidden;
-  /* 5. 设置文本溢出显示省略号 */
-  text-overflow: ellipsis;
+  margin-bottom: 16px;
+  min-height: 60px;
+  height: auto;
+  display: block;
+  overflow: visible;
+  white-space: pre-wrap;
+  word-break: break-word;
 }
 </style>
\ No newline at end of file

src/views/bill/billHome/ResourceLibrarySection.vue

@@ -260,6 +260,7 @@
 import { computed, onMounted, ref } from "vue";
 import { useRouter } from "vue-router";
 import { getHylyList, getPostOrgList, getPostMemberList, getBills, getBillsPerson, getBillsPersonRel, getBillsIsCnCommittee } from "@/api/bill/billHome";
+import { getPersonSummaryInfo } from "@/api/common/index";
 import CommonPrompt from "../commonPrompt/index.vue";
 import desc from "./assets/icons/icon-desc.png";
 import defaultAvatar from "@/assets/icons/default-icon1.png";
@@ -268,6 +269,7 @@ import zyyIcon from "@/assets/icons/zyy.png";
 import cyyIcon from "@/assets/icons/cyy.png";
 import ghdIcon from "@/assets/icons/ghd.png";
 import mzdIcon from "@/assets/icons/mzd.png";
+import { ElMessage } from "element-plus";
 
 const router = useRouter();
 
@@ -405,16 +407,48 @@ const handleBillImageError = e => {
 	img.src = defaultBill;
 };
 
-const handleClickAvatar = member => {
+const handleClickAvatar = async member => {
 	if (!member?.id) return;
+	const personTypeList = JSON.parse(window.sessionStorage.getItem("personTypeList") || "[]");
+	let type = 0;
+	let personTypeName = "";
+	const params = {
+		personId: member.id
+	};
+	try {
+		const res = await getPersonSummaryInfo(params);
+		if (res.code === 200 && res.data) {
+			const arr = personTypeList.filter(item => item.typeId === res.data.personType);
+			if (arr && arr.length > 0) {
+				personTypeName = arr[0].typeName;
+				if (personTypeName === "科技企业领袖") {
+					type = 1;
+				} else if (personTypeName === "国会议员") {
+					type = 2;
+				} else if (personTypeName === "智库研究人员") {
+					type = 3;
+				} else {
+					personTypeName = "";
+					ElMessage.warning("找不到当前人员的类型值！");
+					return;
+				}
 				window.sessionStorage.setItem("curTabName", member.name || "");
 				const routeData = router.resolve({
 					path: "/characterPage",
 					query: {
+						type,
 						personId: member.id
 					}
 				});
 				window.open(routeData.href, "_blank");
+			} else {
+				personTypeName = "";
+				ElMessage.warning("找不到当前人员的类型值！");
+			}
+		} else {
+			ElMessage.warning("找不到当前人员的类型值！");
+		}
+	} catch (error) {}
 };
 
 const getReversedProgress = progress => (Array.isArray(progress) ? [...progress].reverse() : []);

src/views/bill/influence/industry/index.vue

 <template>
 	<div class="industry-wrap">
 		<div class="left">
-			<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-icon1.png" alt="" />
-					</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-top" id="chart1"></div>
+			<AnalysisBox title="涉及行业" :showAllBtn="false" width="100%" height="100%">
+				<div class="left-main">
 					<div class="left-center">
-				<div class="left-center-btn-box">
-					<div
-						class="left-center-btn"
-						:class="{ btnActive: box1BtnActive === index }"
-						v-for="(item, index) in industryList"
-						:key="index"
-						@click="handleClickBox1Btn(item, index)"
+						<el-select
+							v-model="curHylyId"
+							placeholder="请选择行业"
+							class="left-center-select"
+							@change="handleIndustryChange"
 						>
-						{{ item.name }}
-					</div>
-				</div>
+							<el-option
+								v-for="item in industryList"
+								:key="item.id"
+								:label="item.name || item.hylymc"
+								:value="item.id"
+							/>
+						</el-select>
+						<el-input
+							v-model="companySearchKeyword"
+							placeholder="搜索实体"
+							class="left-center-search"
+							:suffix-icon="Search"
+							clearable
+						/>
 					</div>
 					<div class="left-footer">
 						<div class="item-box">
-					<div
-						class="item"
-						:class="{ itemActive: companyActiveIndex === idx }"
-						@click="handleClickCompany(val, idx)"
-						v-for="(val, idx) in curCompanyList"
-						:key="idx"
-					>
+							<div class="item" :class="{ itemActive: companyActiveIndex === idx }"
+								@click="handleClickCompany(val, idx)" v-for="(val, idx) in curCompanyList" :key="val.id">
 								<div class="id">{{ (currentPage - 1) * pageSize + idx + 1 }}</div>
-						<div class="title" :class="{ titleActive: companyActiveIndex === ((currentPage - 1) * pageSize + idx) }">
+								<div class="title"
+									:class="{ titleActive: companyActiveIndex === ((currentPage - 1) * pageSize + idx) }">
 									{{ val.name }}
 								</div>
 								<div class="icon">
@@ -50,37 +41,19 @@
 							</div>
 						</div>
 						<div class="footer-box">
-					<div class="left">{{ `共 ${companyList.length} 项` }}</div>
-					<div class="right">
-						<el-pagination
-							@current-change="handleCurrentChange"
-							:pageSize="pageSize"
-							:current-page="currentPage"
-							size="small"
-							background
-							layout="prev, pager, next"
-							:total="companyList.length"
-						/>
-					</div>
-				</div>
-			</div>
-		</div>
+							<div class="left">{{ `共 ${filteredCompanyList.length} 项` }}</div>
 							<div class="right">
-			<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-icon1.png" alt="" />
+								<el-pagination @current-change="handleCurrentChange" :pageSize="pageSize"
+									:current-page="currentPage" size="small" background layout="prev, pager, next"
+									:total="filteredCompanyList.length" />
 							</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>
+			</AnalysisBox>
 		</div>
+		<div class="right">
+			<AnalysisBox title="产业链分析" :showAllBtn="false" width="100%" height="100%">
 				<div class="right-main">
 					<div class="right-main-content" id="chartGraph">
 						<div class="right-main-content-header">
@@ -134,6 +107,7 @@
 						</div>
 					</div>
 				</div>
+			</AnalysisBox>
 			<div class="graph-dialog" v-if="isShowCompanyDialog">
 				<div class="tool-box">
 					<div class="tool" @click="handleChangeChart(0)">
@@ -210,13 +184,12 @@
 </template>
 
 <script setup>
-import { ref, onMounted, nextTick, computed } from "vue";
+import { ref, onMounted, nextTick, computed, watch } from "vue";
 import { useRoute } from "vue-router";
 import * as echarts from "echarts";
 
 const route = useRoute();
-import { getCompanyList, getIndustryHyly, getHylyList, getCompanyDetail } from "@/api/influence";
-import getBarChart from "./utils/barChart";
+import { getCompanyList, getHylyList, getCompanyDetail } from "@/api/influence";
 import getLineChart from "./utils/lineChart";
 import getBarChart1 from "./utils/barChart1";
 import getGraph from "./utils/graph";
@@ -233,18 +206,16 @@ import uncheckIcon from "./assets/images/uncheck.png";
 import checkedIcon from "./assets/images/checked.png";
 import closeIcon from "./assets/images/close.png";
 
+import { Search } from "@element-plus/icons-vue";
 import Fishbone from "./components/fishbone.vue";
 import CommonPrompt from "../../commonPrompt/index.vue";
+import AnalysisBox from "@/components/base/boxBackground/analysisBox.vue";
 
 import CompanyImg from "./assets/images/symbol.png";
 
 const isShowCompanyDialog = ref(false);
 
-const box1BtnActive = ref(0);
-
-const handleClickBox1Btn = (industry, index) => {
-	box1BtnActive.value = index;
-	curHylyId.value = industry.id;
+const handleIndustryChange = () => {
 	handleGetCompanyListById();
 };
 
@@ -258,32 +229,6 @@ const setChart = (option, chartId) => {
 	return chart;
 };
 
-const chart1Data = ref({
-	name: [],
-	value: [],
-});
-
-const showAllChart1 = ref(false);
-const fullChart1Data = ref({ name: [], value: [] });
-
-// const handleToggleChart1 = () => {
-// 	showAllChart1.value = !showAllChart1.value;
-// 	renderChart1();
-// };
-
-const renderChart1 = () => {
-	let dataName = fullChart1Data.value.name;
-	let dataValue = fullChart1Data.value.value;
-
-	// if (!showAllChart1.value && dataName.length > 5) {
-	// 	dataName = dataName.slice(0, 5);
-	// 	dataValue = dataValue.slice(0, 5);
-	// }
-
-	let chart1 = getBarChart(dataName, dataValue);
-	setChart(chart1, "chart1");
-};
-
 const industryActiveIndex = ref(0);
 const companyActiveIndex = ref(0);
 const curCompanyId = ref("");
@@ -304,11 +249,22 @@ const pageSize = ref(10);
 const currentPage = ref(1);
 
 const companyList = ref([]); // 企业列表
-// 当前企业列表
+const companySearchKeyword = ref(""); // 企业搜索关键词
+
+// 根据关键词筛选后的企业列表
+const filteredCompanyList = computed(() => {
+	const keyword = companySearchKeyword.value?.trim().toLowerCase() || "";
+	if (!keyword) return companyList.value;
+	return companyList.value.filter((item) =>
+		(item.name || "").toLowerCase().includes(keyword)
+	);
+});
+
+// 当前页企业列表（分页 + 筛选）
 const curCompanyList = computed(() => {
 	const startIndex = (currentPage.value - 1) * pageSize.value;
 	const endIndex = startIndex + pageSize.value;
-	return companyList.value.slice(startIndex, endIndex);
+	return filteredCompanyList.value.slice(startIndex, endIndex);
 });
 
 // 处理页码改变事件
@@ -316,6 +272,11 @@ const handleCurrentChange = page => {
 	currentPage.value = page;
 };
 
+// 搜索关键词变化时重置到第一页
+watch(companySearchKeyword, () => {
+	currentPage.value = 1;
+});
+
 const industryList = ref([
 	//  {
 	//     "id": 1,
@@ -365,7 +326,7 @@ const handleGetHylyList = async () => {
 		if (res.data && res.data.length > 0) {
 			curHylyId.value = res.data[0].id;
 		}
-	} catch (error) {}
+	} catch (error) { }
 };
 
 const curHylyId = ref("");
@@ -380,6 +341,7 @@ const handleGetCompanyListById = async () => {
 		// console.log('根据行业id获取公司里列表', res);
 		if (res.code === 200 && res.data.length) {
 			companyList.value = res.data;
+			companySearchKeyword.value = "";
 			currentPage.value = 1;
 			nextTick(() => {
 				handleClickCompany(companyList.value[0], 0);
@@ -387,27 +349,7 @@ const handleGetCompanyListById = async () => {
 		} else {
 			companyList.value = [];
 		}
-	} catch (error) {}
-};
-
-// 根据法案ID 获取行业领域统计
-const handleGetIndustryHyly = async () => {
-	const params = {
-		id: window.sessionStorage.getItem("billId")
-	};
-	try {
-		const res = await getIndustryHyly(params);
-		// console.log('行业领域统计', res);
-		const data = res.data || [];
-		data.sort((a, b) => b.companyNum - a.companyNum);
-		fullChart1Data.value.name = data.map(item => {
-			return item.hylyName;
-		});
-		fullChart1Data.value.value = data.map(item => {
-			return item.companyNum;
-		});
-		renderChart1();
-	} catch (error) {}
+	} catch (error) { }
 };
 
 // 根据法案id，公司id，行业领域id获取公司的详情
@@ -554,7 +496,7 @@ const handleGetCompanyDetail = async () => {
 		} else {
 			companyInfo.value = {};
 		}
-	} catch (error) {}
+	} catch (error) { }
 };
 
 
@@ -750,10 +692,6 @@ onMounted(async () => {
 	setChart(graphChart, "graphChart");
 	await handleGetHylyList();
 	handleGetCompanyListById();
-	await handleGetIndustryHyly();
-	
-	// let chart1 = getBarChart(chart1Data.value.name, chart1Data.value.value);
-	// setChart(chart1, "chart1");
 });
 </script>
 
@@ -762,114 +700,54 @@ onMounted(async () => {
 	width: 100%;
 	height: 100%;
 	display: flex;
-	.box-header {
-		height: 56px;
-		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-right {
-			position: absolute;
-			top: 14px;
-			right: 12px;
-			display: flex;
-			justify-content: flex-end;
-			gap: 4px;
-			.more-btn {
-				font-size: 14px;
-				color: #1677ff;
-				cursor: pointer;
-				line-height: 28px;
-			}
-			.icon {
-				width: 28px;
-				height: 28px;
-				img {
-					width: 100%;
-					height: 100%;
-				}
-			}
-		}
-	}
+
 	.left {
 		margin-top: 16px;
 		width: 480px;
 		height: 848px;
-		background: rgba(255, 255, 255);
-		border-radius: 10px;
-		box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
-		.left-top {
-			margin: 0 auto;
-			width: 446px;
-			height: 200px;
-			box-sizing: border-box;
-			border: 1px solid rgba(231, 241, 255, 1);
-			border-radius: 4px;
-			background: linear-gradient(180deg, rgba(246, 251, 255, 1), rgba(246, 251, 255, 0) 100%);
+
+		.left-main {
+			display: flex;
+			flex-direction: column;
+			height: 100%;
+			overflow: hidden;
 		}
+
 		.left-center {
-			margin-top: 12px;
-			height: 56px;
-			margin-left: 17px;
-			overflow-x: hidden;
-			width: 445px;
-			overflow-x: auto;
-			.left-center-btn-box {
-				width: 1000px;
-				margin-top: 10px;
-				height: 28px;
+			flex: 1;
+			min-height: 0;
+			margin: 12px 17px 0;
 			display: flex;
-				flex-wrap: nowrap;
-				.left-center-btn {
-					margin-right: 4px;
-					height: 28px;
-					// width: 70px;
-					text-align: center;
-					padding: 0 5px;
-					box-sizing: border-box;
-					border-radius: 4px;
-					border: 1px solid var(--btn-plain-border-color);
-					background: var(--btn-plain-bg-color);
-					color: var(--btn-plain-text-color);
-					font-family: Microsoft YaHei;
-					font-size: 14px;
-					font-weight: 400;
-					line-height: 28px;
-					cursor: pointer;
-					// overflow: hidden;
-					text-overflow: ellipsis;
-					white-space: nowrap;
+			align-items: flex-start;
+			gap: 12px;
+
+			.left-center-select {
+				width: 150px;
+				flex-shrink: 0;
 			}
-				.btnActive {
-					border: 1px solid var(--btn-active-border-color);
-					background: var(--btn-active-bg-color);
-					color: var(--btn-active-text-color);
+
+			.left-center-search {
+				flex: 1;
+				min-width: 0;
+
+				:deep(.el-input__wrapper) {
+					border: 1px solid var(--bg-black-10);
+					box-shadow: none;
 				}
 			}
 		}
+
 		.left-footer {
+			flex-shrink: 0;
 			margin: 0 auto;
 			width: 446px;
 			height: 520px;
 			overflow: hidden;
+
 			.item-box {
 				height: 480px;
 				overflow: hidden;
+
 				.item {
 					width: 100%;
 					height: 48px;
@@ -877,9 +755,11 @@ onMounted(async () => {
 					border-bottom: 1px solid rgba(243, 243, 244, 1);
 					display: flex;
 					cursor: pointer;
+
 					&:hover {
 						background: rgba(246, 251, 255, 1);
 					}
+
 					.id {
 						margin-left: 12px;
 						margin-top: 8px;
@@ -894,6 +774,7 @@ onMounted(async () => {
 						font-size: 12px;
 						font-weight: 400;
 					}
+
 					.title {
 						margin-top: 9px;
 						margin-left: 10px;
@@ -908,27 +789,33 @@ onMounted(async () => {
 						text-overflow: ellipsis;
 						white-space: nowrap;
 					}
+
 					.icon {
 						margin-left: 7px;
 						margin-top: 6px;
 						width: 8px;
 						height: 6px;
+
 						img {
 							width: 100%;
 							height: 100%;
 						}
 					}
 				}
+
 				.itemActive {
 					background: rgba(246, 251, 255, 1);
 				}
+
 				.titleActive {
 					color: rgba(22, 119, 255, 1) !important;
 				}
 			}
+
 			.footer-box {
 				display: flex;
 				justify-content: space-between;
+
 				.left {
 					width: 100px;
 					height: 20px;
@@ -938,21 +825,21 @@ onMounted(async () => {
 					font-weight: 400;
 					line-height: 20px;
 				}
+
 				.right {
 					flex: 300px;
 				}
 			}
 		}
 	}
+
 	.right {
 		margin-top: 16px;
 		margin-left: 16px;
 		width: 1247px;
 		height: 847px;
-		background: rgba(255, 255, 255);
-		border-radius: 10px;
-		box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
 		position: relative;
+
 		.graph-dialog {
 			width: 740px;
 			height: 723px;
@@ -961,6 +848,7 @@ onMounted(async () => {
 			top: 55px;
 			z-index: 99999;
 			background: #fff;
+
 			.tool-box {
 				position: absolute;
 				left: 11px;
@@ -975,31 +863,37 @@ onMounted(async () => {
 				display: flex;
 				align-items: center;
 				justify-content: space-around;
+
 				.tool {
 					width: 14px;
 					height: 14px;
 					cursor: pointer;
+
 					img {
 						width: 100%;
 						height: 100%;
 					}
 				}
+
 				.tool1 {
 					width: 16px;
 					height: 16px;
 					cursor: pointer;
+
 					img {
 						width: 100%;
 						height: 100%;
 					}
 				}
 			}
+
 			.chart-box {
 				width: 640px;
 				height: 640px;
 				margin: 50px auto;
 			}
 		}
+
 		.company-dialog {
 			position: absolute;
 			z-index: 999999;
@@ -1011,22 +905,26 @@ onMounted(async () => {
 			border: 1px solid rgba(230, 231, 232, 1);
 			border-radius: 4px;
 			background: rgba(255, 255, 255, 1);
+
 			.dialog-header {
 				height: 54px;
 				box-sizing: border-box;
 				border-bottom: 1px solid rgba(243, 243, 244, 1);
 				display: flex;
 				position: relative;
+
 				.logo {
 					width: 48px;
 					height: 48px;
 					margin-left: 18px;
 					margin-top: 3px;
+
 					img {
 						width: 100%;
 						height: 100%;
 					}
 				}
+
 				.company-title {
 					margin-left: 16px;
 					margin-top: 16px;
@@ -1037,16 +935,19 @@ onMounted(async () => {
 					font-weight: 600;
 					line-height: 22px;
 				}
+
 				.status-icon {
 					margin-left: 12px;
 					margin-top: 12px;
 					width: 8px;
 					height: 6px;
+
 					img {
 						width: 100%;
 						height: 100%;
 					}
 				}
+
 				.status-rate {
 					width: 41px;
 					margin-left: 4px;
@@ -1058,33 +959,40 @@ onMounted(async () => {
 					font-weight: 400;
 					line-height: 22px;
 				}
+
 				.close {
 					position: absolute;
 					right: 15px;
 					top: 19px;
 					width: 16px;
 					height: 16px;
+
 					img {
 						width: 100%;
 						height: 100%;
 					}
 				}
 			}
+
 			.dialog-main {
 				margin-top: 13px;
+
 				.dialog-box1 {
 					.dialog-box1-header {
 						margin-top: 10px;
 						display: flex;
+
 						.icon {
 							margin-left: 16px;
 							width: 18px;
 							height: 18px;
+
 							img {
 								width: 100%;
 								height: 100%;
 							}
 						}
+
 						.dialog-box1-title {
 							margin-top: 2px;
 							margin-left: 6px;
@@ -1097,34 +1005,42 @@ onMounted(async () => {
 							text-align: left;
 						}
 					}
+
 					.dialog-box1-main {
 						margin-top: 4px;
 						margin-left: 18px;
 						max-height: 120px;
 						overflow-y: auto;
+
 						&::-webkit-scrollbar {
 							width: 4px;
 						}
+
 						&::-webkit-scrollbar-thumb {
 							border-radius: 10px;
 							background: rgba(0, 0, 0, 0.2);
 						}
+
 						&::-webkit-scrollbar-track {
 							border-radius: 0;
 							background: rgba(0, 0, 0, 0.1);
 						}
+
 						.item {
 							display: flex;
+
 							.item-left {
 								margin-top: 13px;
 								width: 14px;
 								height: 14px;
 								border-radius: 4px;
+
 								img {
 									width: 100%;
 									height: 100%;
 								}
 							}
+
 							.item-right {
 								margin-top: 8px;
 								margin-left: 9px;
@@ -1139,21 +1055,26 @@ onMounted(async () => {
 						}
 					}
 				}
+
 				.dialog-box2 {
 					margin-left: 16px;
 					margin-top: 50px;
+
 					.dialog-box2-header {
 						margin-top: 10px;
 						display: flex;
+
 						.icon {
 							margin-left: 16px;
 							width: 18px;
 							height: 18px;
+
 							img {
 								width: 100%;
 								height: 100%;
 							}
 						}
+
 						.dialog-box2-title {
 							margin-top: 2px;
 							margin-left: 6px;
@@ -1166,6 +1087,7 @@ onMounted(async () => {
 							text-align: left;
 						}
 					}
+
 					.dialog-box2-main {
 						margin-top: 16px;
 						width: 446px;
@@ -1176,21 +1098,26 @@ onMounted(async () => {
 						background: linear-gradient(180deg, rgba(246, 251, 255, 1), rgba(246, 251, 255, 0) 100%);
 					}
 				}
+
 				.dialog-box3 {
 					margin-top: 16px;
 					margin-left: 16px;
+
 					.dialog-box3-header {
 						margin-top: 10px;
 						display: flex;
+
 						.icon {
 							margin-left: 16px;
 							width: 18px;
 							height: 18px;
+
 							img {
 								width: 100%;
 								height: 100%;
 							}
 						}
+
 						.dialog-box3-title {
 							margin-top: 2px;
 							margin-left: 6px;
@@ -1203,6 +1130,7 @@ onMounted(async () => {
 							text-align: left;
 						}
 					}
+
 					.dialog-box3-main {
 						margin-top: 16px;
 						width: 446px;
@@ -1220,18 +1148,22 @@ onMounted(async () => {
 			width: 1218px;
 			height: 784px;
 			margin: 5px auto;
+
 			.right-main-content {
 				width: 1150px;
 				height: 720px;
 				margin: 4px 0 10px;
+
 				.right-main-content-header {
 					height: 84px;
 					margin-left: 14px;
 					margin-top: 16px;
 					// background: orange;
 					display: flex;
+
 					.header-item1 {
 						width: 408px;
+
 						.header-item1-top {
 							position: relative;
 							z-index: 3;
@@ -1246,18 +1178,22 @@ onMounted(async () => {
 							font-weight: 700;
 							line-height: 28px;
 						}
+
 						.header-item1-bottom {
 							display: flex;
 							justify-content: center;
+
 							.icon {
 								margin-top: 9px;
 								width: 16px;
 								height: 16px;
+
 								img {
 									width: 100%;
 									height: 100%;
 								}
 							}
+
 							.text {
 								margin-top: 7px;
 								margin-left: 8px;
@@ -1270,9 +1206,11 @@ onMounted(async () => {
 							}
 						}
 					}
+
 					.header-item2 {
 						margin-left: -8px;
 						width: 408px;
+
 						.header-item2-top {
 							position: relative;
 							z-index: 2;
@@ -1287,18 +1225,22 @@ onMounted(async () => {
 							font-weight: 700;
 							line-height: 28px;
 						}
+
 						.header-item2-bottom {
 							display: flex;
 							justify-content: center;
+
 							.icon {
 								margin-top: 9px;
 								width: 16px;
 								height: 16px;
+
 								img {
 									width: 100%;
 									height: 100%;
 								}
 							}
+
 							.text {
 								margin-top: 7px;
 								margin-left: 8px;
@@ -1311,9 +1253,11 @@ onMounted(async () => {
 							}
 						}
 					}
+
 					.header-item3 {
 						margin-left: -8px;
 						width: 408px;
+
 						.header-item3-top {
 							position: relative;
 							z-index: 1;
@@ -1328,18 +1272,22 @@ onMounted(async () => {
 							font-weight: 700;
 							line-height: 28px;
 						}
+
 						.header-item3-bottom {
 							display: flex;
 							justify-content: center;
+
 							.icon {
 								margin-top: 9px;
 								width: 16px;
 								height: 16px;
+
 								img {
 									width: 100%;
 									height: 100%;
 								}
 							}
+
 							.text {
 								margin-top: 7px;
 								margin-left: 8px;
@@ -1353,12 +1301,15 @@ onMounted(async () => {
 						}
 					}
 				}
+
 				.right-main-content-main {
 					height: 600px;
 					margin-top: 20px;
 				}
+
 				// background: orange;
 			}
+
 			.box-footer {
 				width: 1218px;
 				height: 40px;
@@ -1367,16 +1318,19 @@ onMounted(async () => {
 				margin: 0 auto;
 				margin-top: 6px;
 				background: rgba(246, 251, 255, 1);
+
 				.box-footer-left {
 					margin-top: 10px;
 					margin-left: 12px;
 					width: 19px;
 					height: 20px;
+
 					img {
 						width: 100%;
 						height: 100%;
 					}
 				}
+
 				.box-footer-center {
 					margin-left: 13px;
 					margin-top: 8px;
@@ -1388,6 +1342,7 @@ onMounted(async () => {
 					font-weight: 400;
 					line-height: 24px;
 				}
+
 				.box-footer-right {
 					margin-left: 13px;
 					margin-top: 8px;
@@ -1398,6 +1353,7 @@ onMounted(async () => {
 					background: #e7f1ff;
 					box-sizing: border-box;
 					padding: 3px;
+
 					img {
 						width: 100%;
 						height: 100%;

src/views/bill/introdoction/index.vue

 <template>
 	<div class="introduction-wrap">
-		<WarningPane
-			v-if="riskSignal"
-			class="risk-signal-pane-top"
-			:warnningLevel="riskSignal.riskLevel"
-			:warnningContent="riskSignal.riskContent"
-		/>
+		<WarningPane v-if="riskSignal" class="risk-signal-pane-top" :warnningLevel="riskSignal.riskLevel"
+			:warnningContent="riskSignal.riskContent" />
 		<div class="introduction-wrap-content">
 			<div class="introduction-wrap-left">
 				<div class="introduction-wrap-left-box1">
@@ -34,7 +30,8 @@
 								<div class="box1-right-item">
 									<div class="item-left">委员会报告：</div>
 									<div class="item-right2" v-if="reportList.length">
-									<div class="right2-item" v-for="(item, index) in reportList" :key="getReportKey(item, index)">
+										<div class="right2-item" v-for="(item, index) in reportList"
+											:key="getReportKey(item, index)">
 											{{ item }}
 										</div>
 									</div>
@@ -50,12 +47,8 @@
 								<div class="box1-right-item">
 									<div class="item-left">立案流程：</div>
 									<div class="item-right4">
-									<div
-										v-for="(item, index) in reversedStageList"
-										:key="getStageKey(item, index)"
-										class="step"
-										:style="{ zIndex: getStageZIndex(index) }"
-									>
+										<div v-for="(item, index) in reversedStageList" :key="getStageKey(item, index)"
+											class="step" :style="{ zIndex: getStageZIndex(index) }">
 											<div class="step-box"
 												:class="{ 'step-box-active': index === stageActiveIndex }">
 												{{ item }}
@@ -86,14 +79,16 @@
 							<div class="name-box">
 								<div class="person-box">
 									<div class="person-item" :class="{ nameItemActive: box3BtnActive === item.name }"
-										@click="handleClcikBox3Btn(item.name, index)" v-for="(item, index) in personList" :key="index">
+										@click="handleClcikBox3Btn(item.name, index)"
+										v-for="(item, index) in personList" :key="index">
 										{{ item.name }}
 									</div>
 								</div>
 							</div>
 							<div class="info-box">
 								<div class="info-left">
-									<img class="person-avatar" :src="curPerson.imageUrl || defaultAvatar" alt="" @click="handleClickAvatar(curPerson)" />
+									<img class="person-avatar" :src="curPerson.imageUrl || defaultAvatar" alt=""
+										@click="handleClickAvatar(curPerson)" />
 									<div class="usr-icon1">
 										<img src="./assets/images/usr-icon1.png" alt="" />
 									</div>
@@ -102,7 +97,8 @@
 									</div>
 								</div>
 								<div class="info-right">
-									<div class="info-right-title" @click="handleClickAvatar(curPerson)">{{ curPerson.name }}</div>
+									<div class="info-right-title" @click="handleClickAvatar(curPerson)">{{
+										curPerson.name }}</div>
 									<div class="info-right-item">
 										<div class="item-left">英文名:</div>
 										<div class="item-right">{{ curPerson.ename }}</div>
@@ -123,7 +119,7 @@
 							</div>
 						</div>
 						<div class="right-main-box2" v-if="curPerson.tagList && curPerson.tagList.length">
-							<div class="tag-box status"v-for="(tag, index) in curPerson.tagList" :key="index">
+							<div class="tag-box status" v-for="(tag, index) in curPerson.tagList" :key="index">
 								{{ tag }}
 							</div>
 						</div>
@@ -159,23 +155,58 @@ import WordCloudMap from "./WordCloudMap.vue";
 import STimeline from "./STimeline.vue";
 import WarningPane from "@/components/base/WarningPane/index.vue";
 import { getBillInfo, getBillPerson, getBillEvent, getBillDyqk } from "@/api/bill";
+import { getPersonSummaryInfo } from "@/api/common/index";
 import defaultAvatar from "../assets/images/default-icon1.png";
 import defaultNew from "../assets/images/default-icon-news.png";
 import defaultBill from "./assets/images/image1.png"
+import { ElMessage } from "element-plus";
 
 const route = useRoute();
 const router = useRouter();
 
 // 跳转到人物页面
-const handleClickAvatar = item => {
-	window.sessionStorage.setItem('curTabName', item.name)
+const handleClickAvatar = async item => {
+	if (!item?.id) return;
+	const personTypeList = JSON.parse(window.sessionStorage.getItem("personTypeList") || "[]");
+	let type = 0;
+	let personTypeName = "";
+	const params = {
+		personId: item.id
+	};
+	try {
+		const res = await getPersonSummaryInfo(params);
+		if (res.code === 200 && res.data) {
+			const arr = personTypeList.filter(val => val.typeId === res.data.personType);
+			if (arr && arr.length > 0) {
+				personTypeName = arr[0].typeName;
+				if (personTypeName === "科技企业领袖") {
+					type = 1;
+				} else if (personTypeName === "国会议员") {
+					type = 2;
+				} else if (personTypeName === "智库研究人员") {
+					type = 3;
+				} else {
+					personTypeName = "";
+					ElMessage.warning("找不到当前人员的类型值！");
+					return;
+				}
+				window.sessionStorage.setItem("curTabName", item.name || "");
 				const routeData = router.resolve({
 					path: "/characterPage",
 					query: {
+						type,
 						personId: item.id
 					}
 				});
 				window.open(routeData.href, "_blank");
+			} else {
+				personTypeName = "";
+				ElMessage.warning("找不到当前人员的类型值！");
+			}
+		} else {
+			ElMessage.warning("找不到当前人员的类型值！");
+		}
+	} catch (error) {}
 };
 // 获取URL地址里面的billId
 const billId = ref(route.query.billId);