提交 9ca77a28 authored 作者: coderBryanFu's avatar coderBryanFu

update

上级 dbb9d172
import request from "@/api/request.js";
// 风险信号
export function getRiskSignal(params) {
return request({
method: 'GET',
url: `/api/commonFeature/riskSignal/${params.moduleId}`,
})
}
// 新闻资讯
export function getNews(params) {
return request({
method: 'GET',
url: `/api/commonFeature/news/${params.moduleId}`,
})
}
// 社交媒体
export function getRemarks(params) {
return request({
method: 'GET',
url: `/api/commonFeature/remarks/${params.moduleId}`,
})
}
\ No newline at end of file
import request from "@/api/request.js";
// 概览页--------------------------------------------------------------------
// 概览统计
export function getStatCount() {
return request({
method: 'GET',
url: `/api/marketsearchHome/statCount`
})
}
// 分类接口
export function getStatSort() {
return request({
method: 'GET',
url: `/api/marketsearchHome/statSort`
})
}
// 调查进展
export function getStatDetails() {
return request({
method: 'GET',
url: `/api/marketsearchHome/statDetails`
})
}
// 调查数量
/**
* @param {byYorM}
*/
export function getStatNum(params) {
return request({
method: 'GET',
url: `/api/marketsearchHome/statNum`,
params
})
}
// 制裁领域分布
/**
* @param {years}
*/
export function getStatArea(params) {
return request({
method: 'GET',
url: `/api/marketsearchHome/statArea`,
params
})
}
// 受调查企业地域分布
/**
* @param {years}
*/
export function getCompanyPlace(params) {
return request({
method: 'GET',
url: `/api/marketsearchHome/getOrgDistribution`,
params
})
}
// 制裁领域分布-企业接口分布
/**
* @param {years}
*/
export function getStatAreaCompanyList() {
return request({
method: 'GET',
url: `/api/marketsearchHome/getOrgSanctionsDomain`,
})
}
// 资源库
// 左侧行业领域列表
export function getHylyList() {
return request({
method: 'GET',
url: `/api/billImpactAnalysis/industry/hylyList`,
})
}
// 获取调查列表接口
/**
* @param {currentPage, pageSize, sortCode, publishYear, Area, sortField, sortOrder}
*/
export function getSurveyList(params) {
return request({
method: 'GET',
url: `/api/marketsearchHome/statList`,
params
})
}
// 详情页---------------------------------------------------
// 获取调查列表接口
/**
* @param { sortCode }
*/
export function getSurvyInfo(params) {
return request({
method: 'GET',
url: `/api/marketsearchHome/statSortDetails`,
params
})
}
\ No newline at end of file
......@@ -67,6 +67,48 @@
class="content ai-content"
v-html="renderMarkdown(message.content)"
></div>
<div v-if="message.raw_data" class="answer-title">完整实体列表</div>
<div v-if="message.raw_data" class="content row-content">
<div class="row-header">
<div class="row-header-item1">{{ message.raw_data.columns.name_zhs }}</div>
<div class="row-header-item">{{ message.raw_data.columns.date }}</div>
<div class="row-header-item">{{ message.raw_data.columns.industry }}</div>
<div class="row-header-item">{{ message.raw_data.columns.category }}</div>
<div class="row-header-item2">{{ message.raw_data.columns.sanction_reason }}</div>
</div>
<div class="row-main">
<div
class="row-main-item"
v-for="(item, index) in message.raw_data.rows"
:key="index"
>
<el-popover
effect="dark"
:width="500"
:content="item.name_zhs"
placement="top-start"
>
<template #reference>
<div class="item-item1">{{ item.name_zhs }}</div>
</template>
</el-popover>
<div class="item-item">{{ item.date }}</div>
<div class="item-item">{{ item.industry }}</div>
<div class="item-item">{{ item.category }}</div>
<el-popover
effect="dark"
:width="400"
:content="item.sanction_reason"
placement="top-start"
>
<template #reference>
<div class="item-item2">{{ item.sanction_reason }}</div>
</template>
</el-popover>
</div>
</div>
</div>
</div>
<!-- 用户消息 -->
<div v-else class="user-item">
......@@ -184,7 +226,39 @@ const messages = ref([
// source: [
// `完整检索实体名单: \n\n 中国科学院空天信息创新研究院\n\n北京复旦微电子技术有限公司\n\n北京天宜源生物科技有限公司\n\n北京擎科生物科技有限公司\n长沙南飞电子技术有限公司\n常州南飞微电子有限公司\n成都南飞微电子有限公司\n中国科学院国家授时中心\n吉姆西半导体科技(无锡)有限公司\n香港德铭电子有限公司\n华科物流(香港)有限公司\n华科供应链(香港)有限公司\n积村半导体科技(上海)有限公司\n生工生物工程(上海)股份有限公司\n上海复旦微电子集团股份有限公司\n上海复旦微电子(香港)有限公司\n上海富控华龙微电子系统技术有限公司\n上海富维迅捷数字科技有限公司\n上海索辰信息科技有限公司\n深圳复旦微电子有限公司\n深圳南飞微电子有限公司\n深圳新力康供应链管理有限公司\n盛美半导体设备(上海)股份有限公司\n总数量:23`
// ],
// content: `2025年9月实体清单的主要制裁实体、制裁原因\n\n 时间范围\n-当前查询的时间范围为:2025年9月16日。`
// content: `2025年9月实体清单的主要制裁实体、制裁原因\n\n 时间范围\n-当前查询的时间范围为:2025年9月16日。`,
// raw_data: {
// columns: {
// category: "实体类别",
// date: "制裁日期",
// industry: "所属行业",
// name_zhs: "实体名称",
// sanction_reason: "制裁理由"
// },
// rows: [
// {
// category: "科研机构",
// date: "2025-09-16",
// industry: "航空航天",
// name_zhs: "中国科学院空天信息创新研究院",
// sanction_reason: "与中国高空气球计划有关联"
// },
// {
// category: "科研机构",
// date: "2025-09-16",
// industry: "航空航天",
// name_zhs: "中国科学院空天信息创新研究院",
// sanction_reason: "与中国高空气球计划有关联"
// },
// {
// category: "科研机构",
// date: "2025-09-16",
// industry: "航空航天",
// name_zhs: "中国科学院空天信息创新研究院",
// sanction_reason: "与中国高空气球计划有关联"
// }
// ]
// }
// }
]);
......@@ -419,6 +493,13 @@ const connectSSE = async question => {
aiMessage.value += content;
updateLastAIMessage(aiMessage.value);
}
if (msgData.raw_data) {
const lastMessage = messages.value[messages.value.length - 1];
if (lastMessage && lastMessage.type === "ai") {
lastMessage.raw_data = msgData.raw_data;
scrollToBottom();
}
}
// if (res.event === "end_of_workflow") {
// ElMessage.success("问答完成!");
// abortController.value.abort();
......@@ -703,6 +784,14 @@ const chat = async question => {
}
}
if (data.raw_data) {
const lastMessage = messages.value[messages.value.length - 1];
if (lastMessage && lastMessage.type === "ai") {
lastMessage.raw_data = data.raw_data;
scrollToBottom();
}
}
if (data.detail.error) {
console.log(data.detail.error.message);
// ElMessage.error(data.detail.error.message);
......@@ -1144,6 +1233,78 @@ onUnmounted(() => {
padding: 1px 10px;
border-radius: 5px;
}
.row-content {
margin-top: 10px;
width: 900px;
margin-left: 26px;
background: rgba(246, 250, 255, 1);
padding: 1px 10px;
border-radius: 5px;
.row-header {
height: 40px;
line-height: 40px;
font-family: Microsoft-YaHei;
font-size: 20px;
color: #555;
font-weight: bold;
display: flex;
border-bottom: 1px solid #999;
.row-header-item {
text-align: center;
width: 150px;
border-right: 1px solid #999;
}
.row-header-item1 {
text-align: center;
width: 250px;
border-right: 1px solid #999;
}
.row-header-item2 {
text-align: center;
width: 200px;
}
}
.row-main {
padding-bottom: 10px;
.row-main-item {
height: 35px;
line-height: 35px;
font-family: Microsoft-YaHei;
font-size: 14px;
color: #555;
display: flex;
border-bottom: 1px solid #ccc;
.item-item {
width: 150px;
text-align: center;
border-right: 1px solid #ccc;
}
.item-item1 {
width: 250px;
text-align: center;
border-right: 1px solid #ccc;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
cursor: pointer;
&:hover {
background: var(--color-bg-hover);
}
}
.item-item2 {
width: 200px;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
cursor: pointer;
&:hover {
background: var(--color-bg-hover);
}
}
}
}
}
}
.user-item {
margin-top: 32px;
......
......@@ -395,17 +395,17 @@ onMounted(() => {
background: rgba(246, 250, 255, 1);
display: flex;
.info-left {
width: 97px;
width: 242px;
height: 136px;
margin-top: 25px;
margin-left: 28px;
img {
width: 100%;
height: 100%;
// height: 100%;
}
}
.info-right {
margin-left: 35px;
margin-left: 20px;
margin-top: 22px;
.info-item {
display: flex;
......@@ -422,7 +422,7 @@ onMounted(() => {
line-height: 24px;
}
.item-right {
width: 899px;
width: 769px;
height: 30px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
......
......@@ -224,8 +224,10 @@ onMounted(() => {
<style lang="scss" scoped>
.layout-container {
width: 1920px;
height: 1016px;
width: 100vw;
height: 100vh;
min-width: 1920px;
min-height: 1016px;
background: rgba(249, 250, 252, 1);
position: relative;
.layout-main {
......
......@@ -444,8 +444,9 @@ onMounted(() => {
<style lang="scss" scoped>
.wrapper {
width: 100%;
height: 879px;
height: 100%;
display: flex;
justify-content: center;
.box-header {
display: flex;
height: 48px;
......
......@@ -328,22 +328,22 @@ onMounted(() => {
}
}
.left {
width: 1150px;
width: 1064px;
.box1 {
margin-top: 16px;
width: 1150px;
width: 1064px;
height: 414px;
border-radius: 4px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
background: rgba(255, 255, 255, 1);
.box1-main {
margin-left: 22px;
width: 1120px;
width: 1034px;
height: 290px;
overflow: hidden;
overflow-y: auto;
.box1-item {
width: 1101px;
width: 1015px;
min-height: 48px;
margin-bottom: 8px;
box-sizing: border-box;
......@@ -364,7 +364,7 @@ onMounted(() => {
color: #0a57a6;
}
.title {
width: 1000px;
width: 914px;
line-height: 24px;
margin-left: 13px;
// overflow: hidden;
......@@ -398,16 +398,16 @@ onMounted(() => {
}
.box2 {
margin-top: 16px;
width: 1150px;
width: 1064px;
height: 415px;
border-radius: 4px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
background: rgba(255, 255, 255, 1);
.box2-main {
margin-top: 3px;
margin-left: 31px;
height: 330px;
width: 1090px;
width: 1004px;
overflow: hidden;
overflow-y: auto;
.box2-item {
......@@ -424,7 +424,7 @@ onMounted(() => {
}
}
.item-center {
width: 892px;
width: 806px;
margin-left: 14px;
.title {
height: 30px;
......@@ -436,7 +436,7 @@ onMounted(() => {
margin-top: -5px;
}
.content {
width: 892px;
width: 806px;
height: 30px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
......@@ -477,14 +477,14 @@ onMounted(() => {
margin-left: 16px;
.box3 {
margin-top: 16px;
width: 576px;
width: 520px;
height: 845px;
border-radius: 4px;
box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
background: rgba(255, 255, 255, 1);
.box3-main {
margin-top: 9px;
width: 520px;
width: 464px;
height: 720px;
// overflow: hidden;
overflow-y: auto;
......@@ -509,7 +509,7 @@ onMounted(() => {
color: #0a57a6;
}
.item-header {
width: 440px;
width: 384px;
height: 35px;
display: flex;
justify-content: space-between;
......@@ -518,7 +518,7 @@ onMounted(() => {
text-overflow: ellipsis;
white-space: nowrap;
.name {
max-width: 460px;
max-width: 384px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
......
......@@ -61,11 +61,12 @@ onMounted(() => {
<style lang="scss" scoped>
.decree-overview-wrap {
width: 1920px;
width: 100%;
height: 100%;
overflow: hidden;
background: rgba(247, 248, 249, 1);
display: flex;
justify-content: center;
.left {
width: 160px;
padding-top: 16px;
......
......@@ -477,16 +477,17 @@ handleGetOrgnization();
.box1-main {
display: flex;
.box1-main-left {
width: 235px;
width: 395px;
height: 332px;
margin-left: 42px;
img {
width: 100%;
height: 100%;
// height: 100%;
}
}
.box1-main-right {
margin-left: 40px;
width: 590px;
margin-left: 20px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
......
......@@ -69,39 +69,39 @@
</div>
</div>
<div class="home-main-header-card-box">
<div class="home-main-header-card-box-box1 card" @click="handleClickToDetail('301')">
<div class="home-main-header-card-box-box1 card" @click="handleClickToDetail(sortInfo[1]?.sortCode)">
<div class="header">
<div class="header-left">{{ "301调查" }}</div>
<div class="header-right">{{ "52项" }}</div>
<div class="header-left">{{ sortInfo[1]?.sortName }}</div>
<div class="header-right">{{ `${sortInfo[1]?.sortCount}项` }}</div>
</div>
<div class="content-box">
<div class="item">{{ "可能措施: 加征关税、限制进口" }}</div>
<div class="item">{{ sortInfo[1]?.sortMeasure }}</div>
<div class="item">
{{ '依据《1974年贸易法》第301条针对"不合理或不公正贸易做法"' }}
{{ sortInfo[1]?.sortDescription }}
</div>
</div>
</div>
<div class="home-main-header-card-box-box2 card" @click="handleClickToDetail('232')">
<div class="home-main-header-card-box-box2 card" @click="handleClickToDetail(sortInfo[2]?.sortCode)">
<div class="header">
<div class="header-left">{{ "232调查" }}</div>
<div class="header-right">{{ "3项" }}</div>
<div class="header-left">{{ sortInfo[2]?.sortName }}</div>
<div class="header-right">{{ `${sortInfo[2]?.sortCount}项` }}</div>
</div>
<div class="content-box">
<div class="item">{{ "可能措施: 加征关税、限制进口" }}</div>
<div class="item">{{ sortInfo[2]?.sortMeasure }}</div>
<div class="item">
{{ "依据《1962年贸易扩展法》第232条评估进口产品对国家安全影响" }}
{{ sortInfo[2]?.sortDescription }}
</div>
</div>
</div>
<div class="home-main-header-card-box-box3 card" @click="handleClickToDetail('337')">
<div class="home-main-header-card-box-box3 card" @click="handleClickToDetail(sortInfo[0]?.sortCode)">
<div class="header">
<div class="header-left">{{ "337调查" }}</div>
<div class="header-right">{{ "87项" }}</div>
<div class="header-left">{{ sortInfo[0]?.sortName }}</div>
<div class="header-right">{{ `${sortInfo[0]?.sortCount}项` }}</div>
</div>
<div class="content-box">
<div class="item">{{ "可能措施: 排除令、禁止令" }}</div>
<div class="item">{{ sortInfo[0]?.sortMeasure }}</div>
<div class="item">
{{ "依据《1930年关税法》第337条针对知识产权侵权行为" }}
{{ sortInfo[0]?.sortDescription }}
</div>
</div>
</div>
......@@ -111,10 +111,10 @@
<DivideHeader id="position1" class="divide-header" :titleText="'最新动态'"></DivideHeader>
<div class="center-top">
<div class="box1">
<div class="box1-left">
<div class="box1-left" @click="handleSwithCurSurvey('left')">
<img src="./assets/images/box1-left.png" alt="" />
</div>
<div class="box1-right">
<div class="box1-right" @click="handleSwithCurSurvey('right')">
<img src="./assets/images/box1-right.png" alt="" />
</div>
<div class="box1-header">
......@@ -128,68 +128,73 @@
{{ "查看详情 >" }}
</div>
</div>
<div class="box1-main">
<div class="box1-main-header">
<div class="header-left">
{{ "美国ITC发布对外国制造的半导体器件及其下游产品和组件的337部分终裁" }}
</div>
<div class="header-right">
<div class="tag1">{{ "337" }}</div>
<div class="tag2">{{ "半导体" }}</div>
</div>
</div>
<div class="info-box">
<div class="info-header">
<div class="icon"></div>
<div class="time">{{ "2025-08-15" }}</div>
<div class="title">{{ "部分终裁" }}</div>
</div>
<div class="info-content">
{{
"对本案行政法官于2025年7月31日作出的初裁(No.36)不予复审,即基于申请方撤回,终止本案对美国注册专利号9,093,473第4项申诉的调查。"
}}
</div>
</div>
<div class="list-box">
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "调查案号:" }}</div>
<div class="list-right">{{ "337-TA-1443" }}</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "涉及产品:" }}</div>
<div class="list-right">
{{
"对美出口、在美进口及销售的特定外国制造的半导体器件及其下游产品和组件(Certain Foreign-Fabricated ..."
}}
</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "原告:" }}</div>
<div class="list-right">
{{ "爱尔兰Longitude Licensing Ltd.、爱尔兰Marlin Semiconductor Limited" }}
<el-carousel
ref="carouselRef"
height="395px"
:autoplay="true"
:interval="3000"
arrow="never"
indicator-position="none"
>
<el-carousel-item v-for="(item, index) in box1DataList" :key="index">
<div class="box1-main">
<div class="box1-main-header">
<div class="header-left">
{{ item.SEARCHNAME }}
</div>
<div class="header-right">
<div class="tag1">{{ item.SEARCHSORT }}</div>
<div class="tag2" v-for="(val, idx) in item.searchArea" :key="idx">{{ val }}</div>
</div>
</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "被告:" }}</div>
<div class="list-right">
{{
"中国台湾地区Taiwan Semiconductor Manufacturing Company Limited of Taiwan、美国Apple Inc. of ...."
}}
<div class="info-box">
<div class="info-header">
<div class="icon"></div>
<div class="time">{{ item.PROGRESSDATE }}</div>
<div class="title">{{ item.PROGRESSRESULT }}</div>
</div>
<div class="info-content">
{{ item.PROGRESSDETAILS }}
</div>
</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "涉案专利" }}</div>
<div class="list-right">
{{ "美国注册专利号7745847、9093473、9147747、9184292" }}
<div class="list-box">
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "调查案号:" }}</div>
<div class="list-right">{{ item.SEARCHNUM }}</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "涉及产品:" }}</div>
<div class="list-right">
{{ item.PRODUCT }}
</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "原告:" }}</div>
<div class="list-right">
{{ item.PLAINTIFF }}
</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "被告:" }}</div>
<div class="list-right">
{{ item.DEFENDANT }}
</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "涉案专利" }}</div>
<div class="list-right">
{{ item.PATENT }}
</div>
</div>
</div>
</div>
</div>
</div>
</el-carousel-item>
</el-carousel>
</div>
<div class="box2">
<div class="box2-header">
......@@ -198,25 +203,39 @@
</div>
<div class="title">
<div class="text">{{ "风险信号" }}</div>
<div class="num">{{ warningList.length }}</div>
<div class="num">{{ box2Data.length }}</div>
</div>
</div>
<div class="box2-main">
<div class="box2-main-item" v-for="(item, index) in warningList" :key="index">
<div class="box2-main-item" v-for="(item, index) in box2Data" :key="index">
<div
class="item-left"
:class="{
itemLeftStatus1: item.status === '一般风险',
itemLeftStatus2: item.status === '重大风险'
itemLeftStatus3: item.signalLevel === '特别重大',
itemLeftStatus2: item.signalLevel === '重大风险'
}"
>
{{ item.status }}
{{ item.signalLevel }}
</div>
<div class="item-right">
<div class="text">
{{ item.title }}
<el-popover
v-if="item.signalTitle?.length > 20"
effect="dark"
:width="480"
:content="item.signalTitle"
placement="top"
>
<template #reference>
<div class="text">
{{ item.signalTitle }}
</div>
</template>
</el-popover>
<div v-else class="text">
{{ item.signalTitle }}
</div>
<div class="time">{{ item.time }}</div>
<div class="time">{{ item.signalTime }}</div>
</div>
</div>
</div>
......@@ -241,16 +260,25 @@
</div>
</div>
<div class="box3-main">
<div class="box3-item" v-for="(news, index) in newsList" :key="index">
<div
class="box3-item"
v-for="(news, index) in newsList"
:key="index"
@click="handleToNewsAnalysis(news)"
>
<div class="left">
<img :src="news.img" alt="" />
<img :src="news.newsImage ? news.newsImage : DefaultNewsIcon" alt="" />
</div>
<div class="right">
<div class="right-top">
<div class="title">{{ news.title }}</div>
<div class="time">{{ news.from }}</div>
<div class="title">{{ news.newsTitle }}</div>
<div class="time">{{ news.newsDate + " · " + news.newsOrg }}</div>
</div>
<div class="right-footer">{{ news.content }}</div>
<el-popover effect="dark" :width="1000" :content="news.newsContent" placement="top-start">
<template #reference>
<div class="right-footer">{{ news.newsContent }}</div>
</template>
</el-popover>
</div>
</div>
</div>
......@@ -264,15 +292,15 @@
</div>
<div class="box4-main">
<div class="box4-main-item" v-for="(item, index) in messageList" :key="index">
<div class="left">
<img :src="item.img" alt="" />
<div class="left" @click="handleClickPerson()">
<img :src="item.personImage ? item.personImage : DefaultUserIcon" alt="" />
</div>
<div class="right">
<div class="right-top">
<div class="name">{{ item.name }}</div>
<div class="time">{{ item.time }}</div>
<div class="name">{{ item.personName }}</div>
<div class="time">{{ item.time + " · " + item.orgName }}</div>
</div>
<div class="content">{{ item.content }}</div>
<div class="content">{{ item.remarks }}</div>
</div>
</div>
</div>
......@@ -298,11 +326,14 @@
<div class="box5-main">
<div class="box5-main-chart" id="chart1"></div>
<div class="box5-main-btn-box">
<div class="right-box rightBoxActive">
{{ "按月度" }}
</div>
<div class="right-box">
{{ "按年度" }}
<div
class="right-box"
:class="{ rightBoxActive: box5BtnActive === item.value }"
v-for="(item, index) in box5BtnList"
:key="index"
@click="handleChangeBox5Btn(item.value)"
>
{{ item.name }}
</div>
</div>
</div>
......@@ -322,7 +353,12 @@
</div>
<div class="box6-main">
<div class="box6-main-select-box">
<el-select v-model="box6SelectedYear" placeholder="选择时间" style="width: 120px">
<el-select
v-model="box6SelectedYear"
@change="handleChangeBox6Year"
placeholder="选择时间"
style="width: 120px"
>
<el-option
v-for="item in box6YearList"
:key="item.value"
......@@ -355,7 +391,12 @@
<div class="box7-main-left" id="box7Chart1"></div>
<div class="box7-main-right">
<div class="box7-main-right-top">
<el-select v-model="box7SelectedYear" placeholder="选择时间" style="width: 120px">
<el-select
v-model="box7SelectedYear"
@change="handleChangeBox7Year"
placeholder="选择时间"
style="width: 120px"
>
<el-option
v-for="item in box7YearList"
:key="item.value"
......@@ -406,7 +447,7 @@
<div class="box8-main-item" v-for="(item, index) in box8Data" :key="index">
<div class="item-1">
<div class="icon">
<img :src="item.logo" alt="" />
<img :src="item.logo ? item.logo : DefaultCompanyIcon" alt="" />
</div>
<div class="text">
{{ item.name }}
......@@ -428,35 +469,34 @@
<div class="btn-box">
<div
class="btn"
:class="{ btnActive: activeCate === cate }"
:class="{ btnActive: activeCateId === cate.id }"
v-for="(cate, index) in categoryList"
:key="index"
@click="handleClickCate(cate)"
>
{{ cate }}
{{ cate.name }}
</div>
</div>
<div class="select-box">
<el-select v-model="releaseTime" placeholder="选择发布时间" style="width: 120px">
<div class="paixu-btn" @click="handleSwithSort">
<div class="icon1">
<img v-if="isSort" src="@/assets/icons/shengxu1.png" alt="" />
<img v-else src="@/assets/icons/jiangxu1.png" alt="" />
</div>
<div class="text">{{ "发布时间" }}</div>
<div class="icon2">
<img v-if="isSort" src="@/assets/icons/shengxu2.png" alt="" />
<img v-else src="@/assets/icons/jiangxu2.png" alt="" />
</div>
</div>
<!-- <el-select v-model="releaseTime" placeholder="选择发布时间" style="width: 120px">
<el-option
v-for="item in releaseTimeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<!-- <el-select
v-model="releaseTime"
placeholder="选择发布时间"
style="width: 120px"
>
<el-option
v-for="item in releaseTimeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> -->
</el-select> -->
</div>
</div>
<div class="home-main-footer-main">
......@@ -467,8 +507,18 @@
<div class="title">{{ "发布时间" }}</div>
</div>
<div class="left-box1-main">
<div class="time-label" v-for="(item, index) in surveyYearList" :key="index">
<el-checkbox v-model="item.selected" :label="item.name" size="large" />
<div class="checkbox-group">
<el-checkbox
v-for="year in surveyYearList"
:key="year.id"
v-model="checkedSurveyYears"
:label="year.id"
style="width: 180px"
class="filter-checkbox"
@change="handleChangeCheckedSurveyYears"
>
{{ year.name }}
</el-checkbox>
</div>
</div>
</div>
......@@ -478,8 +528,18 @@
<div class="title">{{ "涉及领域" }}</div>
</div>
<div class="left-box2-main">
<div class="area-label" v-for="(item, index) in surveyAreaList" :key="index">
<el-checkbox v-model="item.selected" :label="item.name" size="large" />
<div class="checkbox-group">
<el-checkbox
v-for="area in areaList"
:key="area.id"
v-model="checkedAreaList"
:label="area.id"
style="width: 110px"
class="filter-checkbox"
@change="handleChangeCheckedAreas"
>
{{ area.name }}
</el-checkbox>
</div>
</div>
</div>
......@@ -493,32 +553,39 @@
<div class="header-item5">{{ "发布日期" }}</div>
</div>
<div class="right-main">
<div class="item" v-for="(val, idx) in surveyInfoList" :key="idx">
<div class="item" v-for="(val, idx) in surveyInfoList" :key="idx" @click="handleClickToSurveyDetail(val.SORTCODE)">
<div class="item-box1">
<div
class="name"
:class="{
name1: val.name === '301',
name2: val.name === '337',
name3: val.name === '232'
name1: val.SORTCODE === '301',
name2: val.SORTCODE === '337',
name3: val.SORTCODE === '232'
}"
>
{{ val.name }}
{{ val.SORTCODE }}
</div>
<div class="title">{{ val.title }}</div>
<div class="title">{{ val.SEARCHNAME }}</div>
</div>
<div class="item-box2">{{ val.num }}</div>
<div class="item-box3">{{ val.area }}</div>
<div class="item-box4">{{ val.status }}</div>
<div class="item-box5">{{ val.releaseDate }}</div>
<div class="item-box2">{{ val.SEARCHID }}</div>
<div class="item-box3">{{ val.searchArea?.toString() }}</div>
<div class="item-box4">{{ val.CASESTATUS }}</div>
<div class="item-box5">{{ val.SEARCHDATEZH }}</div>
</div>
</div>
<div class="right-footer">
<div class="footer-left">
{{ "共105项调查" }}
{{ `共${totalDiscussNum}项调查` }}
</div>
<div class="footer-right">
<el-pagination background layout="prev, pager, next" :total="105" />
<el-pagination
@current-change="handleCurrentChange"
:pageSize="pageSize"
:current-page="currentPage"
background
layout="prev, pager, next"
:total="totalDiscussNum"
/>
</div>
</div>
</div>
......@@ -530,8 +597,8 @@
<script setup>
import { onMounted, ref } from "vue";
import setChart from "@/utils/setChart";
import scrollToTop from "@/utils/scrollToTop";
import * as echarts from "echarts";
import router from "@/router";
import DivideHeader from "@/components/DivideHeader.vue";
......@@ -556,15 +623,57 @@ import Logo2 from "./assets/images/logo2.png";
import Logo3 from "./assets/images/logo3.png";
import Logo4 from "./assets/images/logo4.png";
import Logo5 from "./assets/images/logo5.png";
import {
getStatSort,
getStatNum,
getStatDetails,
getStatArea,
getHylyList,
getSurveyList,
getStatAreaCompanyList,
getCompanyPlace
} from "@/api/marketAccessRestrictions/index";
import { getRiskSignal, getNews, getRemarks } from "@/api/common/index";
import { ElMessage } from "element-plus";
// 返回首页
const handleBackHome = () => {
router.push({
path: "/overview"
});
import DefaultUserIcon from "@/assets/icons/default-icon1.png";
import DefaultCompanyIcon from "@/assets/icons/default-icon2.png";
import DefaultNewsIcon from "@/assets/icons/default-icon-news.png";
// 首页分类
const sortInfo = ref([{}]);
const handleGetStatSort = async () => {
try {
const res = await getStatSort();
console.log("首页分类", res);
sortInfo.value = res.data;
} catch (error) {}
};
// 调查进展
const box1DataList = ref([]);
const handleGetBox1Data = async () => {
try {
const res = await getStatDetails();
console.log("调查进展", res);
if (res.code === 200 && res.data) {
box1DataList.value = res.data;
}
} catch (error) {}
};
const handleClickToDetail = id => {
const carouselRef = ref(null);
// 点击查看详情
const handleClickToDetail = () => {
let activeIndex = 0;
if (carouselRef.value) {
activeIndex = carouselRef.value.activeIndex;
}
console.log("当前 Carousel 激活索引:", activeIndex);
const id = box1DataList.value[activeIndex].SEARCHSORT;
const route = router.resolve({
path: "/marketAccessLayout",
query: {
......@@ -574,8 +683,17 @@ const handleClickToDetail = id => {
window.open(route.href, "_blank");
};
// 切换当前调查
const handleSwithCurSurvey = name => {
if (name === "left") {
carouselRef.value.prev();
} else {
carouselRef.value.next();
}
};
// 风险信号
const warningList = ref([
const box2Data = ref([
{
title: "关于对中华人民共和国合成阿片类药物供应链...",
time: "一天前",
......@@ -585,70 +703,210 @@ const warningList = ref([
title: "关于调整汽车及汽车零部件进口的公告",
time: "一天前",
status: "特别重大"
}
]);
const handleGetBox2Data = async () => {
const params = {
moduleId: "0104"
};
try {
const res = await getRiskSignal(params);
console.log("风险信号", res);
if (res.code === 200 && res.data) {
box2Data.value = res.data;
}
} catch (error) {}
};
// 新闻资讯
const newsList = ref([
{
img: News1,
title: "美政府停摆仍持续,拨款法案存缺陷,但两党磋商露曙光",
content: `美国政府停摆已持续34天,距离历史上最长的停摆纪录仅差一天,参议院已先后13次尝试...`,
from: "11-4 · 华盛顿邮报"
},
{
title: "关于调整钢铁进口的公告",
time: "一天前",
status: "重大风险"
img: News2,
title: "美参议院通过决议,要求终止特朗普全球关税政策",
content: `参议院以51票赞成、47票反对通过一项决议,旨在终止特朗普实施的全面关税政策,四名......`,
from: "11-4 · 纽约时报"
},
{
title: "关于使用互惠关税规范进口以纠正导致大规模...",
time: "一天前",
status: "重大风险"
img: News3,
title: "美众院通过950亿美元对外援助法案,包含对台军援",
content: `国会众议院在4月通过了大规模对外援助法案,其中包括为“印太安全”提供资金的条款,......`,
from: "11-3 · 洛杉矶时报"
},
{
title: "关于修订对中华人民共和国低价值进口商品适...",
time: "一天前",
status: "一般风险"
img: News4,
title: "“大而美”法案在激烈争议中通过",
content: `特朗普力推的大规模税收与支出法案在国会以微弱优势通过。该法案因大幅削减医疗补助和......`,
from: "11-3 · 今日美国"
},
{
img: News5,
title: "美政府“停摆”追平历史最长纪录,民生多领域受重创",
content: `联邦政府“停摆”进入第35天,追平历史纪录。食品救济项目资金中断,数百万低收入民......`,
from: "11-2 · ​福克斯新闻网"
}
]);
// 获取新闻资讯列表
const handleGetBox3Data = async () => {
const params = {
moduleId: "0104"
};
try {
const res = await getNews(params);
console.log("新闻资讯", res);
if (res.code === 200 && res.data) {
newsList.value = res.data;
}
} catch (error) {}
};
// 点击新闻条目,跳转到新闻分析页
const handleToNewsAnalysis = news => {
const route = router.resolve({
path: "/newsAnalysis",
query: {
newsId: news.newsId
}
});
window.open(route.href, "_blank");
};
const releaseTime = ref("近一年发布");
// 社交媒体
const messageList = ref([]);
const releaseTimeList = ref([
{
label: "近半年发布",
value: "近半年发布"
},
{
label: "近一年发布",
value: "近一年发布"
},
{
label: "近两年发布",
value: "近两年发布"
},
const handleGetBox4Data = async () => {
const params = {
moduleId: "0104"
};
try {
const res = await getRemarks(params);
console.log("社交媒体", res);
if (res.code === 200 && res.data) {
messageList.value = res.data;
}
} catch (error) {}
};
// 点击人物头像,跳转到人物主页
const handleClickPerson = () => {
const route = router.resolve({
path: "/characterPage",
query: {
type: 3 // 1 2 3
}
});
window.open(route.href, "_blank");
};
// 调查数量
const box5BtnList = ref([
{
label: "近三年发布",
value: "近三年发布"
name: "按月度",
value: 1
},
{
label: "近五年发布",
value: "近五年发布"
name: "按年度",
value: 12
}
]);
const box5BtnActive = ref(1);
const handleChangeBox5Btn = val => {
box5BtnActive.value = val;
handleBox5();
};
function transformAllData(originalData) {
// 1. 提取所有年份并去重,排除null和undefined,然后按数字升序排序
const allYears = [
...new Set(
originalData.filter(item => item.searchYorM != null && item.searchYorM !== "").map(item => String(item.searchYorM))
)
].sort((a, b) => Number(a) - Number(b));
const categoryList = ref(["全部调查", "301调查", "232调查", "337调查"]);
// 2. 获取所有调查类型并去重
const allCategories = [...new Set(originalData.map(item => item.sortName))];
const activeCate = ref("全部调查");
const activeHylyId = ref("");
// 3. 为每个类别创建值数组
const categoryData = allCategories.map(category => {
// 对于每个年份,查找对应的数据
const values = allYears.map(year => {
// 查找匹配当前类别和年份的数据
const matchingItem = originalData.find(item => item.sortName === category && String(item.searchYorM) === year);
const handleClickCate = cate => {
console.log(cate);
// 如果找到则返回searchCount,否则返回0
return matchingItem ? matchingItem.searchCount : 0;
});
activeCate.value = cate.hylymc;
activeHylyId.value = cate.hylyid;
handleGetBillsByType();
};
return {
name: category,
value: values
};
});
// 绘制echarts图表
const setChart = (option, chartId) => {
let chartDom = document.getElementById(chartId);
chartDom.removeAttribute("_echarts_instance_");
let chart = echarts.init(chartDom);
chart.setOption(option);
return chart;
};
// 4. 构建最终结果
return {
title: allYears,
data: categoryData
};
}
function transformAllData1(originalData) {
// 1. 提取所有年月并去重,排除null和undefined,然后按时间顺序排序
const allDates = [
...new Set(
originalData.filter(item => item.searchYorM != null && item.searchYorM !== "").map(item => String(item.searchYorM))
)
].sort((a, b) => {
// 自定义排序函数,处理年月格式
const parseDate = dateStr => {
if (dateStr.includes("-")) {
// 处理 "YYYY-MM" 格式
const [year, month] = dateStr.split("-").map(Number);
return { year, month: month || 0 };
} else {
// 处理纯年份格式
return { year: Number(dateStr), month: 0 };
}
};
const dateA = parseDate(a);
const dateB = parseDate(b);
// 先比较年份,再比较月份
if (dateA.year !== dateB.year) {
return dateA.year - dateB.year;
}
return dateA.month - dateB.month;
});
// 2. 获取所有调查类型并去重
const allCategories = [...new Set(originalData.map(item => item.sortName))];
// 3. 为每个类别创建值数组
const categoryData = allCategories.map(category => {
// 对于每个日期,查找对应的数据
const values = allDates.map(date => {
// 查找匹配当前类别和日期的数据
const matchingItem = originalData.find(item => item.sortName === category && String(item.searchYorM) === date);
// 如果找到则返回searchCount,否则返回0
return matchingItem ? matchingItem.searchCount : 0;
});
return {
name: category,
value: values
};
});
// 4. 构建最终结果
return {
title: allDates,
data: categoryData
};
}
const chart1Data = ref({
title: ["2014", "2015", "2016", "2017", "2018", "2019", "2020", "2021", "2022", "2023", "2024", "2025"],
......@@ -667,8 +925,32 @@ const chart1Data = ref({
}
]
});
const hadleGetStatNum = async () => {
const params = {
byYorM: box5BtnActive.value // 月度:1 年度:12
};
try {
const res = await getStatNum(params);
console.log("调查数量", res);
if (res.code === 200 && res.data) {
if (box5BtnActive.value === 1) {
chart1Data.value = transformAllData1(res.data);
} else {
chart1Data.value = transformAllData(res.data);
}
}
} catch (error) {}
};
const box7YearList = ref([
const handleBox5 = async () => {
await hadleGetStatNum();
let chart1 = getMultiLineChart(chart1Data.value);
setChart(chart1, "chart1");
};
// 制裁领域分布
const box6SelectedYear = ref("2025");
const box6YearList = ref([
{
label: "2025",
value: "2025"
......@@ -694,216 +976,101 @@ const box7YearList = ref([
value: "2020"
}
]);
const handleChangeBox6Year = () => {
handleBox6();
};
const box6Data = ref({
title: [],
data: [
{
name: "337调查",
value: []
},
{
name: "232调查",
value: []
},
{
name: "301调查",
value: []
}
],
maxNum: 0
});
const handleGetStatArea = async () => {
const params = {
years: box6SelectedYear.value
};
try {
const res = await getStatArea(params);
console.log("制裁领域分布", res);
if (res.code === 200 && res.data) {
const arr = res.data.map(item => {
return item.AREANAME;
});
box6Data.value.title = [...new Set(arr)];
const box7SelectedYear = ref("2025");
const surveyYearList = ref([
{
name: "全部时间",
selected: false
},
{
name: "2025年",
selected: false
},
{
name: "2024年",
selected: false
},
{
name: "2023年",
selected: false
},
{
name: "2022年",
selected: false
},
{
name: "2021年",
selected: false
}
]);
const surveyAreaList = ref([
{
name: "人工智能",
selected: false
},
{
name: "半导体/芯片",
selected: false
},
{
name: "电子设备",
selected: false
},
{
name: "显示技术",
selected: false
},
{
name: "新能源",
selected: false
},
{
name: "通信设备",
selected: false
}
]);
const arr1 = res.data.filter(item => {
return item.SORTNAME === "337调查";
});
const arr1Name = arr1.map(item => {
return item.AREANAME;
});
box6Data.value.title.forEach((item, index) => {
if (arr1Name.indexOf(item) > -1) {
const idx = arr1Name.indexOf(item);
box6Data.value.data[0].value[index] = arr1[idx].AREACOUNT;
} else {
box6Data.value.data[0].value[index] = 0;
}
});
const surveyInfoList = ref([
{
name: "301",
title: "某些车辆远程信息处理、车队管理以及基于视频的安全系统、设备和组件12",
num: "337-TA-1393",
area: "半导体",
status: "正在调查",
releaseDate: "2025年9月1日"
},
{
name: "337",
title: "某些蒸发器设备,其中使用的墨盒及其组件(II)",
num: "337-TA-1392",
area: "制造业",
status: "正在调查",
releaseDate: "2025年8月15日"
},
{
name: "301",
title: "某些Topcon太阳能电池,模块,面板,组件及其组件和包含相同产品",
num: "337-TA-1422和337-TA-1425(合并)",
area: "半导体",
status: "正在调查",
releaseDate: "2025年8月10日"
},
{
name: "337",
title: "某些光伏干线总线电缆组件及其组件",
num: "337-TA-1438",
area: "光伏",
status: "正在调查",
releaseDate: "2025年7月29日"
},
{
name: "337",
title: "某些外国制造的半导体器件、包含相同产品及其组件的组件",
num: "337-TA-1443",
area: "半导体",
status: "正在调查",
releaseDate: "2025年7月18日"
},
{
name: "301",
title: "某些车辆远程信息处理、车队管理以及基于视频的安全系统、设备及其组件",
num: "337-TA-1441",
area: "半导体",
status: "终止调查",
releaseDate: "2025年7月1日"
},
{
name: "337",
title: "某些包含相同功能的无线前端模块和设备",
num: "337-TA-1435",
area: "半导体",
status: "正在调查",
releaseDate: "2025年6月14日"
},
{
name: "337",
title: "用于液晶显示器的某些玻璃基板,含有相同产品的产品以及制造相同方法的玻璃基板",
num: "337-TA-1433",
area: "显示技术",
status: "正在调查",
releaseDate: "2025年6月5日"
},
{
name: "337",
title: "某些Topcon太阳能电池,模块,面板,组件及其组件和包含相同产品",
num: "337-TA-1422和337-TA-1425(合并)",
area: "光伏",
status: "终止调查",
releaseDate: "2025年8月10日"
},
{
name: "232",
title: "某些蒸发器设备,其中使用的墨盒及其组件(II)",
num: "337-TA-1392",
area: "制造业",
status: "终止调查",
releaseDate: "2025年8月15日"
}
]);
const arr2 = res.data.filter(item => {
return item.SORTNAME === "232调查";
});
const arr2Name = arr2.map(item => {
return item.AREANAME;
});
box6Data.value.title.forEach((item, index) => {
if (arr2Name.indexOf(item) > -1) {
const idx = arr2Name.indexOf(item);
box6Data.value.data[1].value[index] = arr2[idx].AREACOUNT;
} else {
box6Data.value.data[1].value[index] = 0;
}
});
// 新闻资讯
const newsList = ref([
{
img: News1,
title: "美政府停摆仍持续,拨款法案存缺陷,但两党磋商露曙光",
content: `美国政府停摆已持续34天,距离历史上最长的停摆纪录仅差一天,参议院已先后13次尝试...`,
from: "11-4 · 华盛顿邮报"
},
{
img: News2,
title: "美参议院通过决议,要求终止特朗普全球关税政策",
content: `参议院以51票赞成、47票反对通过一项决议,旨在终止特朗普实施的全面关税政策,四名......`,
from: "11-4 · 纽约时报"
},
{
img: News3,
title: "美众院通过950亿美元对外援助法案,包含对台军援",
content: `国会众议院在4月通过了大规模对外援助法案,其中包括为“印太安全”提供资金的条款,......`,
from: "11-3 · 洛杉矶时报"
},
{
img: News4,
title: "“大而美”法案在激烈争议中通过",
content: `特朗普力推的大规模税收与支出法案在国会以微弱优势通过。该法案因大幅削减医疗补助和......`,
from: "11-3 · 今日美国"
},
{
img: News5,
title: "美政府“停摆”追平历史最长纪录,民生多领域受重创",
content: `联邦政府“停摆”进入第35天,追平历史纪录。食品救济项目资金中断,数百万低收入民......`,
from: "11-2 · ​福克斯新闻网"
}
]);
const arr3 = res.data.filter(item => {
return item.SORTNAME === "301调查";
});
const arr3Name = arr3.map(item => {
return item.AREANAME;
});
box6Data.value.title.forEach((item, index) => {
if (arr3Name.indexOf(item) > -1) {
const idx = arr3Name.indexOf(item);
box6Data.value.data[2].value[index] = arr3[idx].AREACOUNT;
} else {
box6Data.value.data[2].value[index] = 0;
}
});
// 社交媒体
const messageList = ref([
{
img: Message1,
name: "唐纳德·特朗普",
time: "15:23 · 发布于真实社交",
content: `埃隆·马斯克在强力支持我竞选总统之前,早就知道我强烈反对‘电动汽车强制令’。这太荒谬了,这一直是我竞选活动的主要部分。电动汽车没问题,但不应该强迫每个人都拥有一辆。埃隆获得的补贴可能远远超过历史上任何一个人。如果没有补贴,埃隆可能不得不关门大吉,回到南非老家。`
},
{
img: Message2,
name: "埃隆·马斯克",
time: "14:49 · 发布于X",
content: `如果这个疯狂的支出法案获得通过,‘美国党’将在第二天成立。`
},
{
img: Message3,
name: "塞巴斯蒂安·马拉比",
time: "11:05 · 发布于X",
content: `提出特朗普政府的AI政策强调技术开放与快速应用,但可能以牺牲安全防范为代价,开启了“潘多拉魔盒”。`
}
]);
const numArr = res.data.map(item => {
return item.AREACOUNT;
});
// 查看更多风险信号
const handleToMoreRiskSignal = () => {
const route = router.resolve("/riskSignal");
window.open(route.href, "_blank");
box6Data.value.maxNum = Math.max(...numArr);
}
} catch (error) {}
};
// 查看更多新闻资讯
const handleToMoreNews = () => {
const route = router.resolve("/newsBrief");
window.open(route.href, "_blank");
const handleBox6 = async () => {
await handleGetStatArea();
let chart2 = getRadarChart(box6Data.value);
setChart(chart2, "chart2");
};
// 制裁领域分布
const box6SelectedYear = ref("2025");
const box6YearList = ref([
const box7YearList = ref([
{
label: "2025",
value: "2025"
......@@ -930,6 +1097,12 @@ const box6YearList = ref([
}
]);
const box7SelectedYear = ref("2025");
const handleChangeBox7Year = () => {
handleGetBox7Data2();
};
const box7Chart1Data = ref([
{
name: "337调查",
......@@ -972,96 +1145,282 @@ const box7Chart1Data = ref([
}
]);
const box7Chart2Data = ref([
{
name: "广东省",
value: 42
},
{
name: "上海市",
value: 35
},
{
name: "浙江省",
value: 28
},
{
name: "江苏省",
value: 19
},
const box7Chart2Data = ref([]);
const handleGetBox7Data2 = async () => {
const params = {
years: box7SelectedYear.value
};
try {
const res = await getCompanyPlace(params);
console.log("企业地域分布", res);
if (res.code === 200 && res.data) {
box7Chart2Data.value = res.data
.filter(item => {
return item.ORGPROVINCE;
})
.map(item => {
return {
name: item.ORGPROVINCE,
value: item.PROVINCECOUNT
};
});
let box7Chart2 = getBarChart(box7Chart2Data.value);
setChart(box7Chart2, "box7Chart2");
} else {
box7Chart2Data.value = [];
}
} catch (error) {}
};
handleGetBox7Data2();
// 制裁领域分布企业分布
const box8Data = ref([
// {
// logo: Logo1,
// name: "华为技术有限公司",
// data337: 12,
// data301: 2,
// data232: 1
// },
// {
// logo: Logo2,
// name: "大疆创新科技有限公司",
// data337: 7,
// data301: 1,
// data232: null
// },
// {
// logo: Logo3,
// name: "TCL科技集团股份有限公司",
// data337: 6,
// data301: 1,
// data232: null
// },
// {
// logo: Logo4,
// name: "中兴通讯股份有限公司",
// data337: 6,
// data301: null,
// data232: null
// },
// {
// logo: Logo5,
// name: "联想集团",
// data337: 6,
// data301: null,
// data232: null
// }
]);
const handleGetBox8Data = async () => {
try {
const res = await getStatAreaCompanyList();
console.log("制裁领域分布-企业分布", res);
if (res.code === 200 && res.data) {
const arr = res.data.map(item => {
return item.ORGNAME;
});
const nameArr = [...new Set(arr)];
console.log("nameArr", nameArr);
box8Data.value = Array.from({ length: nameArr.length }, () => ({
name: "",
data337: null,
data232: null,
data301: null,
logo: null
}));
nameArr.forEach((item, index) => {
box8Data.value[index].name = item;
box8Data.value[index].data337 = null;
box8Data.value[index].data301 = null;
box8Data.value[index].data232 = null;
box8Data.value[index].logo = null;
});
box8Data.value.forEach(item => {
res.data.forEach(val => {
if (val.ORGNAME === item.name && val.SORTCODE === "337") {
item.data337 = val.ORGCOUNT;
}
if (val.ORGNAME === item.name && val.SORTCODE === "232") {
item.data232 = val.ORGCOUNT;
}
if (val.ORGNAME === item.name && val.SORTCODE === "302") {
item.data301 = val.ORGCOUNT;
}
});
});
console.log("box8Data", box8Data.value);
}
} catch (error) {
console.error(error);
}
};
// 资源库
const pageSize = ref(10);
const currentPage = ref(1);
const totalDiscussNum = ref(0);
const handleCurrentChange = page => {
currentPage.value = page;
handleGetSurveyList();
};
const categoryList = ref([
{
name: "北京市",
value: 15
name: "全部调查",
id: ""
},
{
name: "四川省",
value: 12
name: "301调查",
id: "301"
},
{
name: "山东省",
value: 11
name: "232调查",
id: "232"
},
{
name: "福建省",
value: 8
name: "337调查",
id: "337"
}
]);
const box8Data = ref([
const activeCateId = ref("");
const handleClickCate = cate => {
activeCateId.value = cate.id;
handleGetSurveyList();
};
const isSort = ref(true); // true 升序 false 倒序
const handleSwithSort = () => {
isSort.value = !isSort.value;
};
const surveyYearList = ref([
{
logo: Logo1,
name: "华为技术有限公司",
data337: 12,
data301: 2,
data232: 1
name: "2025年",
id: "2025"
},
{
logo: Logo2,
name: "大疆创新科技有限公司",
data337: 7,
data301: 1,
data232: null
name: "2024年",
id: "2024"
},
{
logo: Logo3,
name: "TCL科技集团股份有限公司",
data337: 6,
data301: 1,
data232: null
name: "2023年",
id: "2023"
},
{
logo: Logo4,
name: "中兴通讯股份有限公司",
data337: 6,
data301: null,
data232: null
name: "2022年",
id: "2022"
},
{
logo: Logo5,
name: "联想集团",
data337: 6,
data301: null,
data232: null
name: "2021年",
id: "2021"
}
]);
onMounted(async () => {
let chart1 = getMultiLineChart(
chart1Data.value.title,
chart1Data.value.data[0].value,
chart1Data.value.data[1].value,
chart1Data.value.data[2].value
);
setChart(chart1, "chart1");
const checkedSurveyYears = ref(["2025"]);
const handleChangeCheckedSurveyYears = () => {
// console.log(checkedSurveyYears.value);
handleGetSurveyList();
};
let chart2 = getRadarChart();
setChart(chart2, "chart2");
const areaList = ref([
// { id: "人工智能", name: "人工智能" },
]);
const checkedAreaList = ref(["1"]);
const handleGetAreaList = async () => {
try {
const res = await getHylyList();
console.log("行业领域列表", res);
if (res.code === 200 && res.data) {
areaList.value = res.data.map(item => {
return {
name: item.name,
id: item.id
};
});
console.log("areaList", areaList.value);
}
} catch (error) {}
};
const handleChangeCheckedAreas = () => {
// console.log(checkedAreaList.value);
handleGetSurveyList();
};
const surveyInfoList = ref([
]);
const handleGetSurveyList = async () => {
const params = {
currentPage: currentPage.value - 1,
pageSize: pageSize.value,
sortCode: activeCateId.value,
publishYear: checkedSurveyYears.value.toString(),
Area: checkedAreaList.value.toString(),
sortField: "date",
sortOrder: isSort.value ? "asc" : "desc"
};
try {
const res = await getSurveyList(params);
console.log("调查列表", res);
if (res.code === 200 && res.data) {
totalDiscussNum.value = res.data.totalElements;
surveyInfoList.value = res.data.content;
} else {
surveyInfoList.value = [];
ElMessage.warning("当前条件下无调查列表数据!");
}
} catch (error) {}
};
const handleClickToSurveyDetail = (id) => {
const route = router.resolve({
path: "/marketAccessLayout",
query: {
id: id
}
});
window.open(route.href, "_blank");
};
// 查看更多风险信号
const handleToMoreRiskSignal = () => {
const route = router.resolve("/riskSignal");
window.open(route.href, "_blank");
};
// 查看更多新闻资讯
const handleToMoreNews = () => {
const route = router.resolve("/newsBrief");
window.open(route.href, "_blank");
};
// 返回首页
const handleBackHome = () => {
router.push({
path: "/overview"
});
};
onMounted(async () => {
handleGetBox1Data();
handleGetStatSort();
handleGetBox2Data();
handleGetBox3Data();
handleGetBox4Data();
handleBox5();
handleBox6();
handleGetBox8Data();
let box7Chart1 = getMapChart(box7Chart1Data.value);
setChart(box7Chart1, "box7Chart1");
let box7Chart2 = getBarChart(box7Chart2Data.value);
setChart(box7Chart2, "box7Chart2");
await handleGetAreaList();
handleGetSurveyList();
});
</script>
......@@ -1288,6 +1647,7 @@ onMounted(async () => {
.content-box {
margin-left: 30px;
.item {
width: 485px;
height: 24px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
......@@ -1295,6 +1655,9 @@ onMounted(async () => {
font-weight: 400;
line-height: 24px;
margin-top: 8px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
......@@ -1346,6 +1709,7 @@ onMounted(async () => {
.content-box {
margin-left: 30px;
.item {
width: 485px;
height: 24px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
......@@ -1353,6 +1717,9 @@ onMounted(async () => {
font-weight: 400;
line-height: 24px;
margin-top: 8px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
......@@ -1405,6 +1772,7 @@ onMounted(async () => {
.content-box {
margin-left: 30px;
.item {
width: 485px;
height: 24px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
......@@ -1412,6 +1780,9 @@ onMounted(async () => {
font-weight: 400;
line-height: 24px;
margin-top: 8px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
......@@ -1436,6 +1807,7 @@ onMounted(async () => {
.box1-left {
position: absolute;
left: 0;
z-index: 9999;
top: 220px;
width: 24px;
height: 48px;
......@@ -1449,6 +1821,7 @@ onMounted(async () => {
position: absolute;
right: 0;
top: 220px;
z-index: 9999;
width: 24px;
height: 48px;
cursor: pointer;
......@@ -1519,8 +1892,9 @@ onMounted(async () => {
}
.header-right {
display: flex;
width: 200px;
width: 300px;
justify-content: flex-end;
flex-wrap: wrap;
.tag1 {
height: 24px;
line-height: 24px;
......@@ -1575,6 +1949,7 @@ onMounted(async () => {
line-height: 24px;
}
.title {
width: 200px;
margin-left: 11px;
margin-top: 10px;
height: 24px;
......@@ -1588,6 +1963,8 @@ onMounted(async () => {
.info-content {
width: 909px;
height: 60px;
overflow: hidden;
overflow-y: auto;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
......@@ -1602,8 +1979,10 @@ onMounted(async () => {
margin-left: 28px;
width: 940px;
height: 185px;
overflow: hidden;
overflow-y: auto;
.list-item {
height: 37px;
min-height: 37px;
display: flex;
.icon {
width: 4px;
......@@ -1708,9 +2087,9 @@ onMounted(async () => {
&:hover {
background: var(--color-bg-hover);
}
.itemLeftStatus1 {
color: rgba(82, 196, 26, 1) !important;
background: rgba(246, 255, 237, 1) !important;
.itemLeftStatus3 {
background: rgba(255, 241, 240) !important;
color: rgba(245, 34, 45, 1) !important;
}
.itemLeftStatus2 {
color: rgba(250, 140, 22, 1) !important;
......@@ -1722,8 +2101,8 @@ onMounted(async () => {
width: 40px;
height: 40px;
border-radius: 20px;
background: rgba(255, 241, 240);
color: rgba(245, 34, 45, 1);
color: rgba(82, 196, 26, 1);
background: rgba(246, 255, 237, 1);
font-family: Microsoft YaHei;
font-size: 12px;
font-weight: 400;
......@@ -1739,15 +2118,18 @@ onMounted(async () => {
border-bottom: 1px solid rgba(240, 242, 244, 1);
display: flex;
.text {
width: 348px;
width: 328px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 47px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.time {
margin-left: 10px;
margin-left: 2px;
line-height: 47px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
......@@ -1855,6 +2237,10 @@ onMounted(async () => {
width: 749px;
margin-left: 21px;
border-bottom: 1px solid rgba(240, 242, 244, 1);
cursor: pointer;
&:hover {
background: var(--color-bg-hover);
}
.left {
width: 72px;
height: 48px;
......@@ -1873,7 +2259,7 @@ onMounted(async () => {
justify-content: space-between;
.title {
margin-top: 13px;
width: 520px;
width: 470px;
height: 24px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
......@@ -1885,15 +2271,18 @@ onMounted(async () => {
white-space: nowrap;
}
.time {
flex: 1;
width: 187px;
text-align: right;
height: 22px;
margin-top: 19px;
margin-top: 15px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
line-height: 22px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.right-footer {
......@@ -1962,6 +2351,7 @@ onMounted(async () => {
}
.box4-main {
height: 402px;
overflow: hidden;
overflow-y: auto;
box-sizing: border-box;
padding-top: 8px;
......@@ -1973,6 +2363,9 @@ onMounted(async () => {
margin-top: 5px;
width: 36px;
height: 36px;
border-radius: 18px;
overflow: hidden;
cursor: pointer;
img {
width: 100%;
height: 100%;
......@@ -2512,7 +2905,8 @@ onMounted(async () => {
}
.home-main-footer {
// width: 100%;
height: 1149px;
// height: 1149px;
padding-bottom: 20px;
background: rgba(248, 249, 250, 1);
overflow: hidden;
.home-main-footer-header {
......@@ -2555,27 +2949,70 @@ onMounted(async () => {
height: 42px;
box-sizing: border-box;
padding: 5px 0;
.paixu-btn {
display: flex;
width: 120px;
height: 32px;
box-sizing: border-box;
border: 1px solid rgba(230, 231, 232, 1);
border-radius: 4px;
background: rgba(255, 255, 255, 1);
&:hover {
background: var(--color-bg-hover);
}
cursor: pointer;
.icon1 {
width: 11px;
height: 14px;
margin-top: 10px;
margin-left: 9px;
img {
width: 100%;
height: 100%;
}
}
.text {
height: 19px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
line-height: 18px;
letter-spacing: 0px;
text-align: left;
margin-top: 7px;
margin-left: 9px;
}
.icon2 {
width: 10px;
height: 5px;
margin-top: 5px;
margin-left: 13px;
img {
width: 100%;
height: 100%;
}
}
}
}
}
.home-main-footer-main {
width: 1600px;
margin-bottom: 20px;
height: 985px;
// box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
// background: rgba(255, 255, 255, 1);
// height: 985px;
margin: 0 auto;
box-sizing: border-box;
// padding: 20px;
display: flex;
.left {
width: 300px;
height: 560px;
height: 700px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
background: rgba(255, 255, 255, 1);
.left-box1 {
margin-top: 17px;
height: 260px;
height: 220px;
.left-box1-header {
display: flex;
.icon {
......@@ -2597,10 +3034,7 @@ onMounted(async () => {
}
.left-box1-main {
margin-top: 10px;
.time-label {
height: 35px;
margin-left: 25px;
}
padding-left: 20px;
}
}
.left-box2 {
......@@ -2627,17 +3061,15 @@ onMounted(async () => {
}
.left-box2-main {
margin-top: 10px;
.area-label {
height: 35px;
margin-left: 25px;
}
padding-left: 20px;
}
}
}
.right {
margin-left: 16px;
width: 1284px;
height: 899px;
min-height: 700px;
// height: 899px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
background: rgba(255, 255, 255, 1);
......@@ -2698,12 +3130,16 @@ onMounted(async () => {
}
}
.right-main {
height: 780px;
// background: orange;
min-height: 586px;
border-bottom: 1px solid rgba(230, 231, 232, 1);
// height: 780px;
.item {
display: flex;
padding: 16px 0;
// height: 56px;
cursor: pointer;
&:hover{
background: var(--color-bg-hover) !important;
}
&:nth-child(2n) {
background: rgba(247, 248, 249, 1);
}
......@@ -2797,9 +3233,10 @@ onMounted(async () => {
}
}
.right-footer {
box-sizing: border-box;
padding-top: 15px;
height: 60px;
display: flex;
// height: 60px;
// background: orange;
justify-content: space-between;
.footer-left {
color: rgba(59, 65, 75, 1);
......
......@@ -8,7 +8,7 @@ const getBarChart = (originalData) => {
tooltip: {},
grid: {
top: '3%',
right: '3%',
right: 66,
bottom: '1%',
left: '1%',
containLabel: true
......
import * as echarts from 'echarts'
const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
const getMultiLineChart = (data) => {
console.log('dataaaa',data);
return {
tooltip: {
trigger: 'axis',
......@@ -13,9 +15,9 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
},
grid: {
top: '15%',
right: '5%',
right: '3%',
bottom: '5%',
left: '5%',
left: '3%',
containLabel: true
},
legend: {
......@@ -28,7 +30,7 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
{
type: 'category',
boundaryGap: false,
data: dataX
data: data.title
}
],
yAxis: [
......@@ -38,7 +40,7 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
],
series: [
{
name: '337调查',
name: data.data[0].name,
type: 'line',
areaStyle: {
......@@ -53,10 +55,10 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
emphasis: {
focus: 'series'
},
data: dataY1
data: data.data[0].value
},
{
name: '301调查',
name: data.data[1].name,
type: 'line',
areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
......@@ -70,10 +72,10 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
emphasis: {
focus: 'series'
},
data: dataY2
data: data.data[1].value,
},
{
name: '232调查',
name: data.data[2].name,
type: 'line',
areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
......@@ -87,7 +89,7 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
emphasis: {
focus: 'series'
},
data: dataY3
data: data.data[2].value,
}
]
}
......
const getRadarChart = () => {
const indicators = [
{ name: "集成电路", max: 10 },
{ name: "能源领域", max: 10 },
{ name: "量子科技", max: 10 },
{ name: "通信网络", max: 10 },
{ name: "人工智能", max: 10 },
{ name: "生物科技", max: 10 }
];
const getRadarChart = (data) => {
// const indicators = [
// { name: "集成电路", max: 10 },
// { name: "能源领域", max: 10 },
// { name: "量子科技", max: 10 },
// { name: "通信网络", max: 10 },
// { name: "人工智能", max: 10 },
// { name: "生物科技", max: 10 }
// ];
const indicators = data.title.map(item => {
return {
name: item, max: data.maxNum
}
})
const data337 = [9, 6, 6, 6, 9, 7];
const data301 = [5, 3, 7, 8, 7, 9];
const data232 = [4, 10, 3, 4, 2, 5];
......@@ -67,9 +72,10 @@ const getRadarChart = () => {
},
series: [
{
name: "337调查",
// name: "337调查",
name: data.data[0].name,
type: "radar",
data: [{ value: data337 }],
data: [{ value: data.data[0].value }],
lineStyle: {
width: 2,
color: "rgba(5, 95, 194,1)"
......@@ -80,9 +86,9 @@ const getRadarChart = () => {
}
},
{
name: "301调查",
name: data.data[1].name,
type: "radar",
data: [{ value: data301 }],
data: [{ value: data.data[1].value }],
lineStyle: {
width: 2,
color: "rgba(250, 140, 22, 1)"
......@@ -93,9 +99,9 @@ const getRadarChart = () => {
}
},
{
name: "232调查",
name: data.data[2].name,
type: "radar",
data: [{ value: data232 }],
data: [{ value: data.data[2].value }],
lineStyle: {
width: 2,
color: "rgba(146, 84, 222, 1)"
......
......@@ -801,9 +801,9 @@ onMounted(() => {
.box1-main-right {
margin-left: 38px;
margin-top: 26px;
margin-top: 6px;
width: 800px;
height: 270px;
height: 300px;
}
}
......
......@@ -3,7 +3,7 @@ const getPieChart = (data) => {
series: [
{
type: 'pie',
radius: [70, 100],
radius: [80, 110],
height: '100%',
left: 'center',
width: '100%',
......
......@@ -16,12 +16,19 @@ const getPieChart = (data) => {
formatter: '{name|{b}}\n{time|{c} 条 {d}%}',
minMargin: 5,
edgeDistance: 10,
lineHeight: 15,
lineHeight: 24,
rich: {
time: {
fontSize: 10,
color: '#999'
}
name: {
fontSize: 16,
color: 'rgba(59, 65, 75, 1)',
fontFamily: 'Microsoft YaHei',
fontWeight: 700
},
time: {
fontSize: 16,
color: 'rgba(95, 101, 108, 1)',
fontFamily: 'Microsoft YaHei',
}
}
},
labelLine: {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论