提交 dff9b452 authored 作者: 胡卉清's avatar 胡卉清

合并分支 'dev_hhq' 到 'master'

Dev hhq 查看合并请求 !105
import request from "@/api/request.js";
// 中美博弈概览V2:最新风险动态统计
export function getLatestRiskUpdates(params) {
return request({
method: 'GET',
url: `/api/rivalryIndexV2/LatestRiskUpdates`,
params: params
})
}
// 中美博弈概览V2:最新风险信号
export function getLatestRisks() {
return request({
method: 'GET',
url: `/api/rivalryIndexV2/LatestRisks`,
})
}
// 中美博弈概览V2:美对华制裁措施数量趋势
export function geDomainContainmentTrend(params) {
return request({
method: 'GET',
url: `/api/rivalryIndexV2/DomainContainmentTrend`,
params: params
})
}
// 中美博弈概况:获取榜单字典
export function getChartDict() {
return request({
method: 'GET',
url: `/api/union/summary/chartDict`,
})
}
// 中美博弈概况:中美科技实力对比
export function getCompare(id) {
return request({
method: 'GET',
url: `/api/union/summary/compare/${id}`,
})
}
// 中美博弈分析
export function getTechnologyGameAnalysis() {
return request({
method: 'GET',
url: `/api/rivalryIndexV2/TechnologyGameAnalysis`,
})
}
//中美博弈概览V7:美国政府部门对华制裁最新动态
export function getGovernmentSanctionsDynamics() {
return request({
method: 'GET',
url: `/api/rivalryIndex/governmentSanctionsDynamics`,
})
}
\ No newline at end of file
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<div class="timeline-box"> <div class="timeline-box">
<div class="line" style="width:100vw ;" /> <div class="line" style="width:100vw ;" />
<!-- 一次性渲染全部节点 --> <!-- 一次性渲染全部节点 -->
<div v-for="(item, i) in data" :key="item[idKey]" class="node" :style="leftStyle(i)"> <div v-for="(item, i) in showList" :key="item[idKey]" class="node" :style="leftStyle(i)">
<!-- 圆环 --> <!-- 圆环 -->
<div class="dot" :class="linePos(item)" :style="{ '--i': item.unit === '中国' ? ' #E29697' : '#69A0DA' }" /> <div class="dot" :class="linePos(item)" :style="{ '--i': item.unit === '中国' ? ' #E29697' : '#69A0DA' }" />
...@@ -22,20 +22,21 @@ ...@@ -22,20 +22,21 @@
<!-- 卡片 --> <!-- 卡片 -->
<div class="card" :class="[cardPos(item), 'right-side']" @click="$emit('click-card', item)"> <div class="card" :class="[cardPos(item), 'right-side']" @click="$emit('click-card', item)">
<div style="justify-content: space-between;display: flex;width: 300px;"> <div style="justify-content: space-between;display: flex;width: 300px;">
<div class="tag">{{ item.tag }}</div> <div class="tag">{{ item.eventStrategy }}</div>
<img :src="`/icon/${item.unit}.png`" class="icon"></img> <img :src="item.eventCountryImg" class="icon"
style="border-radius: 14px;height: 28px;width: 28px;;"></img>
</div> </div>
<div class="title" :style="{ <div class="title" :style="{
}">{{ item.title }}</div> }">{{ item.eventName }}</div>
<div class="time">{{ item.time }}</div> <div class="time">{{ item.eventDate }}</div>
<!-- <div class="title" :style="{ <!-- <div class="title" :style="{
color: item.unit === '中国' ? ' #CF4F51' : '' color: item.unit === '中国' ? ' #CF4F51' : ''
}">{{ item.title }}</div> }">{{ item.title }}</div>
<div class="time">{{ item.time }}</div> --> <div class="time">{{ item.time }}</div> -->
<div class="content">{{ item.content }}</div> <div class="content">{{ item.eventDesc }}</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -85,7 +86,7 @@ export default { ...@@ -85,7 +86,7 @@ export default {
}, },
/* 卡片上下位置:unit=0 -> 下侧,其余 -> 上侧 */ /* 卡片上下位置:unit=0 -> 下侧,其余 -> 上侧 */
cardPos(item) { cardPos(item) {
return item.unit === '中国' ? 'down' : 'up'; return item.eventType === '反制措施' ? 'down' : 'up';
}, },
/* 延伸线方向 = 卡片方向 */ /* 延伸线方向 = 卡片方向 */
linePos(item) { linePos(item) {
...@@ -278,7 +279,7 @@ export default { ...@@ -278,7 +279,7 @@ export default {
width: 120px; width: 120px;
height: 28px; height: 28px;
/* 自动布局 */ /* 自动布局 */
display: flex; /* display: flex; */
flex-direction: row; flex-direction: row;
justify-content: flex-start; justify-content: flex-start;
align-items: flex-start; align-items: flex-start;
...@@ -303,7 +304,7 @@ export default { ...@@ -303,7 +304,7 @@ export default {
width: 120px; width: 120px;
height: 28px; height: 28px;
/* 自动布局 */ /* 自动布局 */
display: flex; /* display: flex; */
flex-direction: row; flex-direction: row;
justify-content: flex-start; justify-content: flex-start;
align-items: flex-start; align-items: flex-start;
...@@ -346,9 +347,23 @@ export default { ...@@ -346,9 +347,23 @@ export default {
line-height: 24px; line-height: 24px;
letter-spacing: 0px; letter-spacing: 0px;
text-align: justify; text-align: justify;
width: 300px;
/* 设置一个固定的宽度 */
height: 100px;
/* 设置一个固定的高度,确保只显示 5 行 */
font-size: 16px;
/* 设置字体大小 */
line-height: 20px;
/* 设置行高 */
overflow: hidden; overflow: hidden;
/* 隐藏超出部分 */
display: -webkit-box; display: -webkit-box;
/* 使用 Webkit 的 box 模型 */
-webkit-line-clamp: 3;
/* 限制为 5 行 */
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-webkit-line-clamp: 6; /* 垂直排列内容 */
text-overflow: ellipsis;
/* 超出部分显示省略号 */
} }
</style> </style>
\ No newline at end of file
...@@ -9,18 +9,12 @@ ...@@ -9,18 +9,12 @@
<div style="display: flex; height: 650px; width: 100%"> <div style="display: flex; height: 650px; width: 100%">
<div style="width: 50%"> <div style="width: 50%">
<div <div
style=" style="display: flex; justify-content: space-between; margin-right: 50px; line-height: 32px;align-items: center;">
display: flex;
justify-content: space-between;
margin-right: 50px;
line-height: 32px;
align-items: center;
"
>
<div style="display: flex; margin-left: 50px"> <div style="display: flex; margin-left: 50px">
数据来源: 数据来源:
<el-select class="select-item" size="default" style="margin-left: 15px; width: 240px; height: 32px"> <el-select class="select-item" size="default" style="margin-left: 15px; width: 240px; height: 32px"
<el-option label="国家创新指数报告" value="last_year" /> v-model="origin" @change="handleGetCompare()">
<el-option :value="value.id" :label="value.name" v-for="value in originList" />
</el-select> </el-select>
</div> </div>
<div style="display: flex"> <div style="display: flex">
...@@ -33,30 +27,22 @@ ...@@ -33,30 +27,22 @@
<div style="width: 672px; height: 486px; padding-top: 50px" id="char"></div> <div style="width: 672px; height: 486px; padding-top: 50px" id="char"></div>
</div> </div>
<div style="width: 50%"> <div style="width: 50%; height: 620px;overflow: auto;">
<el-table :data="tableData" style="width: 100%; margin-bottom: 20px" row-key="id" border default-expand-all> <el-table :data="tableData" style="width: 100%; margin-bottom: 20px" row-key="id" border default-expand-all>
<el-table-column prop="name" label="指标名称" sortable width="350" /> <el-table-column prop="targetName" label="指标名称" sortable width="350" />
<el-table-column prop="percent" label="中国"> <el-table-column prop="chinaScore" label="中国">
<template #default="scope"> <template #default="scope">
<div class="progress-wrapper left" :style="{ '--i': '40px', '--j': '-20px', marginLeft: '20px' }"> <div class="progress-wrapper left" :style="{ '--i': '40px', '--j': '-20px', marginLeft: '20px' }">
<el-progress <el-progress :percentage="scope.row.chinaScore" :stroke-width="20" class="left-progress"
:percentage="scope.row.percent[0]" :show-text="false" />
:stroke-width="20"
class="left-progress"
:show-text="false"
/>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="percent" label="美国"> <el-table-column prop="usScore" label="美国">
<template #default="scope"> <template #default="scope">
<div class="progress-wrapper right" :style="{ '--i': '40px', marginRight: '20px' }"> <div class="progress-wrapper right" :style="{ '--i': '40px', marginRight: '20px' }">
<el-progress <el-progress :percentage="scope.row.usScore" :stroke-width="20" class="right-progress"
:percentage="scope.row.percent[0]" :show-text="false" />
:stroke-width="20"
class="right-progress"
:show-text="false"
/>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -74,19 +60,13 @@ ...@@ -74,19 +60,13 @@
</div> </div>
</div> </div>
<div class="btn-box"> <div class="btn-box">
<div <div v-for="(value, index) in btnList" class="btn-item" :style="{
v-for="(value, index) in btnList"
class="btn-item"
:style="{
background: value.background background: value.background
}" }">
>
<img :src="`/public/icon/ZM/btn-icon-${index}.png`" style="width: 22px; height: 19px; margin: 0 22px" /> <img :src="`/public/icon/ZM/btn-icon-${index}.png`" style="width: 22px; height: 19px; margin: 0 22px" />
{{ value.text }} {{ value.text }}
<img <img :src="`/public/icon/ZM/btn-icon-arrow.png`"
:src="`/public/icon/ZM/btn-icon-arrow.png`" style="margin-left: auto; margin-right: 22px; width: 13px; height: 12px" />
style="margin-left: auto; margin-right: 22px; width: 13px; height: 12px"
/>
</div> </div>
</div> </div>
</div> </div>
...@@ -98,12 +78,9 @@ import * as echarts from "echarts"; ...@@ -98,12 +78,9 @@ import * as echarts from "echarts";
import Timeline from "./Timeline.vue"; import Timeline from "./Timeline.vue";
import tableShow from "./tableShow.vue"; import tableShow from "./tableShow.vue";
import {
getTechnologyGameAnalysis,
getDomainContainmentRanking,
getDomainContainmentTimeline
} from "@/api/zmOverview/allDomains";
import radarChart from "./radarChart3.js"; import radarChart from "./radarChart3.js";
import { getCompare, getChartDict, getTechnologyGameAnalysis } from '@/api/zmOverview/risk/index.js'
const course = ref([ const course = ref([
{ {
time: "2025-01-15", time: "2025-01-15",
...@@ -158,75 +135,86 @@ const course = ref([ ...@@ -158,75 +135,86 @@ const course = ref([
} }
]); ]);
// 处理时间线数据的方法 const originList = ref([])
const processTimelineData = rawData => { const origin = ref('')
if (!rawData || !Array.isArray(rawData) || rawData.length === 0) { //数据来源
return []; const handleGetChartDict = async () => {
}
return rawData.map(item => {
// 根据eventType确定unit值
let unit = "";
if (item.eventType === "反制措施") {
unit = "中国";
} else if (item.eventType === "行政令") {
unit = "美国";
} else {
// 如果有其他类型,可以根据需要设定默认值或保持原有值
unit = item.eventOrg || ""; // 使用eventOrg作为备选
}
return {
time: item.eventDate || "",
title: item.eventName || "",
content: item.eventDesc || "",
unit: unit,
tag: item.eventStrategy || "",
// 保留其他原始字段
eventId: item.eventId,
eventOrg: item.eventOrg,
eventType: item.eventType,
eventCountryImg: item.eventCountryImg
};
});
};
// 获取技术博弈分析数据
const handleGetTechnologyGameAnalysis = async () => {
try { try {
const res = await getTechnologyGameAnalysis();
console.log("技术博弈分析数据", res);
const res = await getChartDict();
console.log("数据来源", res);
if (res.code === 200 && res.data) { if (res.code === 200 && res.data) {
// 处理返回的数据结构 originList.value = res.data
const processedData = processTimelineData(res.data); origin.value = res.data[0].id
course.value = processedData;
} }
} catch (error) { } catch (error) {
console.error("获取技术博弈分析数据失败:", error); console.error("获取数据来源error", error);
// 设置默认空数组
course.value = [];
} }
}; };
//中美科技实力对比
const handleGetCompare = async () => {
try {
onMounted(() => { const res = await getCompare(origin.value);
console.log("中美科技实力对比", res);
if (res.code === 200 && res.data) {
tableData.value = res.data
const secondLevelData = res.data[0].children;
const indicatorNames = secondLevelData.map(item => item.targetName);
const chinaScores = secondLevelData.map(item => item.chinaScore);
const usScores = secondLevelData.map(item => item.usScore);
const dom = document.getElementById("char"); const dom = document.getElementById("char");
const myChart = echarts.init(dom); const myChart = echarts.init(dom);
const radarOption = {
// 2. 传入容器,生成配置 indicatorNames: indicatorNames,
const option = radarChart( data: [
["创新资源", "知识创造", "企业创新", "创新绩效", "创新环境"], chinaScores,
[ usScores
[4200, 3000, 20000, 35000, 50000, 18000],
[1000, 42000, 32000, 35000, 50000, 18000]
] ]
};
const option = radarChart(
radarOption.indicatorNames, radarOption.data
); );
myChart.setOption(option); myChart.setOption(option);
console.log(radarOption)
}
} catch (error) {
console.error("获取中美科技实力对比error", error);
}
};
//中美博弈概览V2:领域打压遏制时间线
const handlegetTechnologyGameAnalysis = async () => {
try {
// setChart(option, "char7"); const res = await getTechnologyGameAnalysis();
// 获取时间线数据 console.log("中美科技博弈分析", res);
handleGetTechnologyGameAnalysis(); if (res.code === 200 && res.data) {
course.value = res.data
}
} catch (error) {
console.error("获取中美科技博弈分析error", error);
}
};
onMounted(async () => {
await handleGetChartDict()
await handleGetCompare()
await handlegetTechnologyGameAnalysis()
// const dom = document.getElementById("char");
// const myChart = echarts.init(dom);
// // 2. 传入容器,生成配置
// const option = radarChart(
// ["创新资源", "知识创造", "企业创新", "创新绩效", "创新环境"],
// [
// [4200, 3000, 20000, 35000, 50000, 18000],
// [1000, 42000, 32000, 35000, 50000, 18000]
// ]
// );
// myChart.setOption(option);
// // setChart(option, "char7");
}); });
const tableData = ref([ const tableData = ref([
...@@ -348,6 +336,7 @@ const btnList = ref([ ...@@ -348,6 +336,7 @@ const btnList = ref([
width: 1600px; width: 1600px;
height: 1600px; height: 1600px;
margin: 0 auto; margin: 0 auto;
.card-box { .card-box {
width: 1600px; width: 1600px;
height: 700px; height: 700px;
......
...@@ -34,7 +34,7 @@ let instance = null ...@@ -34,7 +34,7 @@ let instance = null
/* 配置项 */ /* 配置项 */
const makeOption = () => { const makeOption = () => {
const p = Math.min(100, Math.max(0, props.percent)) / 100 const p = Math.min(100, Math.max(0, props.percent)) / 100
console.log(props.color, 'colorcolorcolor') // console.log(props, 'colorcolorcolor')
return { return {
series: [{ series: [{
type: 'liquidFill', type: 'liquidFill',
...@@ -73,8 +73,8 @@ const makeOption = () => { ...@@ -73,8 +73,8 @@ const makeOption = () => {
formatter: function () { formatter: function () {
const change = props.data.change; const change = props.data.change;
const unit = props.data.unit; const unit = props.data.unit;
if (change === '无新增') { if (change === 0) {
return `{noChange|${change}}\n{b|共${props.data.count}${unit}}` return `{num|${'无新增'}}`
} }
return `{num|${change}}{unit| ${unit}}\n{b|共${props.data.count}${unit}}` return `{num|${change}}{unit| ${unit}}\n{b|共${props.data.count}${unit}}`
}, },
......
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
{{ sections[index].title }} {{ sections[index].title }}
</div> </div>
<div style="width: 50px; color: #ffffff"> <div style="width: 50px; color: #ffffff">
{{ sections[index].date }} {{ sections[index].date.slice(-5) }}
</div> </div>
</div> </div>
</div> </div>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<img class="section-title" src="./icon/title-icon-2.png" /> <img class="section-title" src="./icon/title-icon-2.png" />
<div>风险信号</div> <div>风险信号</div>
<div class="num">12</div> <div class="num">{{ riskTotal }}</div>
<div class="manage-btn" @click="handleToRiskManage"> <div class="manage-btn" @click="handleToRiskManage">
风险信号管理 > 风险信号管理 >
</div> </div>
...@@ -74,22 +74,22 @@ ...@@ -74,22 +74,22 @@
<div class="carousel-title"> <div class="carousel-title">
<div> <div>
<div class="title-text"> <div class="title-text">
{{ News.title }} {{ News.hotspotTitle }}
</div> </div>
<div class="title-tag"> <div class="title-tag">
{{ News.category }} {{ News.hotspotType }}
</div> </div>
</div> </div>
<img src="./icon/矩形 295.png" style="width: 96px; height: 96px" /> <img :src="News.hotspotPicture" style="width: 96px; height: 96px" />
</div> </div>
<div style="/* 矩形 351 */ width: 664px; height: 1px; background: rgba(234, 236, 238, 1)"></div> <div style="/* 矩形 351 */ width: 664px; height: 1px; background: rgba(234, 236, 238, 1)"></div>
<div class="news-carousel-content">{{ News.content }}</div> <div class="news-carousel-content">{{ News.hotspotDesc }}</div>
<div class="carousel-bottom"> <div class="carousel-bottom">
<div class="left">{{ News.date + News.source }}</div> <div class="left">{{ News.hotspotDate + News.hotspotOrgName }}</div>
<div class="right"> <div class="right">
<div v-for="tag in News.tags" class="tag"> <div v-for="tag in News.domainList" class="tag">
{{ tag }} {{ tag.name }}
</div> </div>
</div> </div>
</div> </div>
...@@ -105,9 +105,10 @@ ...@@ -105,9 +105,10 @@
<script setup> <script setup>
import { color } from "echarts"; import { color } from "echarts";
import { onMounted, ref, computed } from "vue"; import { onMounted, ref, computed, onBeforeUnmount } from "vue";
import WaveBall from "./WaveBall.vue"; import WaveBall from "./WaveBall.vue";
import { getBillRiskSignal } from "@/api/bill/billHome"; import { getBillRiskSignal } from "@/api/bill/billHome";
import { getLatestRiskUpdates, getLatestRisks } from '@/api/zmOverview/risk/index.js'
const sectionTab = [ const sectionTab = [
{ {
textColor: "rgba(9, 88, 217, 1)", textColor: "rgba(9, 88, 217, 1)",
...@@ -148,14 +149,14 @@ const sections = ref([ ...@@ -148,14 +149,14 @@ const sections = ref([
date: "12-18", date: "12-18",
waveBall: [ waveBall: [
{ {
percent: 30, // 估算的百分比 percent: 0, // 估算的百分比
count: 1626, count: 1626,
change: "+3", change: "+3",
unit: "项", unit: "项",
title: "法案(提出)" title: "法案(提出)"
}, },
{ {
percent: 20, // 估算的百分比 percent: 0, // 估算的百分比
count: 69, count: 69,
change: "+2", change: "+2",
unit: "个", unit: "个",
...@@ -168,14 +169,14 @@ const sections = ref([ ...@@ -168,14 +169,14 @@ const sections = ref([
date: "12-19", date: "12-19",
waveBall: [ waveBall: [
{ {
percent: 10, // 估算的百分比 percent: 0, // 估算的百分比
count: 128, count: 128,
change: "+1", change: "+1",
unit: "次", unit: "次",
title: "实体清单" title: "实体清单"
}, },
{ {
percent: 20, // 估算的百分比 percent: 0, // 估算的百分比
count: 69, count: 69,
change: "+1", change: "+1",
unit: "次", unit: "次",
...@@ -188,15 +189,15 @@ const sections = ref([ ...@@ -188,15 +189,15 @@ const sections = ref([
date: "12-15", date: "12-15",
waveBall: [ waveBall: [
{ {
percent: 15, // 估算的百分比 percent: 0, // 估算的百分比
count: 35, count: 0,
change: "+1", change: "+1",
unit: "次", unit: "次",
title: "SDN" title: "SDN"
}, },
{ {
percent: 5, // 估算的百分比 percent: 0, // 估算的百分比
count: 28, count: 0,
change: "+1", change: "+1",
unit: "家", unit: "家",
title: "涉军企业" title: "涉军企业"
...@@ -208,22 +209,22 @@ const sections = ref([ ...@@ -208,22 +209,22 @@ const sections = ref([
date: "12-15", date: "12-15",
waveBall: [ waveBall: [
{ {
percent: 3, // 估算的百分比 percent: 0, // 估算的百分比
count: 215, count: 0,
change: "+1", change: "+1",
unit: "次", unit: "次",
title: "337调查" title: "337调查"
}, },
{ {
percent: 3, // 估算的百分比 percent: 0, // 估算的百分比
count: 14, count: 0,
change: "无新增", change: "无新增",
unit: "次", unit: "次",
title: "230调查" title: "230调查"
}, },
{ {
percent: 3, // 估算的百分比 percent: 0, // 估算的百分比
count: 9, count: 0,
change: "无新增", change: "无新增",
unit: "次", unit: "次",
title: "301调查" title: "301调查"
...@@ -231,21 +232,117 @@ const sections = ref([ ...@@ -231,21 +232,117 @@ const sections = ref([
] ]
} }
]); ]);
// 风险信号
const warningList = ref([]); // 最新风险动态统计
// 获取法案风险信号 const handleGetLatestRiskUpdates = async () => {
const handlegetBillRiskSignal = async () => {
const params = {
moduleId: "0100"
};
try { try {
const res = await getBillRiskSignal(params); const params = {
console.log("法案风险信号", res); currentDate: '本周'
if (res.code === 200) { }
warningList.value = res.data; const res = await getLatestRiskUpdates(params);
console.log("最新风险动态统计", res);
if (res.code === 200 && res.data) {
sections.value = [
{
title: res.data.policiesRegulations.hotspotTitle,
date: res.data.policiesRegulations.hotspotDate,
waveBall: [
{
percent: 30, // 估算的百分比
count: res.data.bill.total,
change: res.data.bill.dailyIncrement,
unit: "项",
title: "法案(提出)"
},
{
percent: 20, // 估算的百分比
count: res.data.administrativeOrder.total,
change: res.data.administrativeOrder.dailyIncrement,
unit: "个",
title: "政令"
}
]
},
{
title: res.data.exportControl.hotspotTitle,
date: res.data.exportControl.hotspotDate,
waveBall: [
{
percent: 10, // 估算的百分比
count: res.data.Entities.total,
change: res.data.Entities.dailyIncrement,
unit: "次",
title: "实体清单"
},
{
percent: 20, // 估算的百分比
count: res.data.CCL.total,
change: res.data.CCL.dailyIncrement,
unit: "次",
title: "CCL"
}
]
},
{
title: res.data.investmentFinancingRestrictions.hotspotTitle,
date: res.data.investmentFinancingRestrictions.hotspotDate,
waveBall: [
{
percent: 15, // 估算的百分比
count: res.data.SDN.total,
change: res.data.SDN.dailyIncrement,
unit: "次",
title: "SDN"
},
{
percent: 5, // 估算的百分比
count: res.data.militaryInvolvement.total,
change: res.data.militaryInvolvement.dailyIncrement,
unit: "家",
title: "涉军企业"
}
]
},
{
title: res.data.marketAccess.hotspotTitle,
date: res.data.marketAccess.hotspotDate,
waveBall: [
{
percent: 3, // 估算的百分比
count: res.data['337Survey'].total,
change: res.data['337Survey'].dailyIncrement,
unit: "次",
title: "337调查"
},
{
percent: 3, // 估算的百分比
count: res.data['232Survey'].total,
change: res.data['232Survey'].dailyIncrement,
unit: "次",
title: "230调查"
},
{
percent: 3, // 估算的百分比
count: res.data['301Survey'].total,
change: res.data['301Survey'].dailyIncrement,
unit: "次",
title: "301调查"
}
]
}
]
console.log(sections.value, 'sections.value')
}
} catch (error) {
console.error("获取最新风险动态统计error", error);
} }
} catch (error) { }
}; };
// 风险信号
const warningList = ref([]);
const riskTotal = ref(0)
const hotNewsList = ref([ const hotNewsList = ref([
{ {
title: "美国白宫发布关于进一步延长TikTok执法宽限期的行政令", title: "美国白宫发布关于进一步延长TikTok执法宽限期的行政令",
...@@ -266,6 +363,24 @@ const hotNewsList = ref([ ...@@ -266,6 +363,24 @@ const hotNewsList = ref([
tags: ['人工智能', '通信网络'] tags: ['人工智能', '通信网络']
} }
]); ]);
//最新风险信号
const handleGetLatestRisks = async () => {
try {
const res = await getLatestRisks();
console.log("最新风险信号", res);
if (res.code === 200 && res.data) {
warningList.value = res.data.riskVOS
hotNewsList.value = res.data.hotspotVOS
riskTotal.value = res.data.riskCount
console.log(hotNewsList.value, 'hotNewsList.value')
}
} catch (error) {
console.error("获取最新风险信号error", error);
}
};
const curNews = ref({}); const curNews = ref({});
const carouselRef = ref(null); const carouselRef = ref(null);
const curHotNewsListIndex = ref(0); const curHotNewsListIndex = ref(0);
...@@ -289,11 +404,16 @@ const handleSwithCurNews = name => { ...@@ -289,11 +404,16 @@ const handleSwithCurNews = name => {
carouselRef.value.next(); carouselRef.value.next();
} }
}; };
onMounted(() => { onMounted(async () => {
// 这里可以添加从后端获取数据的代码
handlegetBillRiskSignal(); await handleGetLatestRiskUpdates()
await handleGetLatestRisks()
console.log("页面加载完成,可以获取数据了"); console.log("页面加载完成,可以获取数据了");
}); });
// onBeforeUnmount(() => {
// andleGetLatestRiskUpdates()
// });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -344,6 +464,7 @@ onMounted(() => { ...@@ -344,6 +464,7 @@ onMounted(() => {
text-align: left; text-align: left;
display: flex; display: flex;
align-items: center; align-items: center;
img { img {
/* 矢量 347 */ /* 矢量 347 */
width: 22px; width: 22px;
...@@ -375,8 +496,10 @@ onMounted(() => { ...@@ -375,8 +496,10 @@ onMounted(() => {
} }
.manage-btn { .manage-btn {
margin-left: auto; /* 推到最右侧 */ margin-left: auto;
margin-right: 16px; /* 适当的右边距 */ /* 推到最右侧 */
margin-right: 16px;
/* 适当的右边距 */
padding: 4px 12px; padding: 4px 12px;
border-radius: 20px; border-radius: 20px;
background-color: rgba(206, 79, 81, 0.1); background-color: rgba(206, 79, 81, 0.1);
...@@ -430,7 +553,7 @@ onMounted(() => { ...@@ -430,7 +553,7 @@ onMounted(() => {
font-style: Bold; font-style: Bold;
font-size: 20px; font-size: 20px;
font-weight: 700; font-weight: 700;
line-height: 26px; // line-height: 26px;
letter-spacing: 0px; letter-spacing: 0px;
text-align: center; text-align: center;
display: flex; display: flex;
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论