提交 eba3a093 authored 作者: coderBryanFu's avatar coderBryanFu

政令资源库请求修改

......@@ -1646,6 +1646,7 @@
"resolved": "https://registry.npmmirror.com/@types/lodash-es/-/lodash-es-4.17.12.tgz",
"integrity": "sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"@types/lodash": "*"
}
......@@ -1762,6 +1763,7 @@
"resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.5.21.tgz",
"integrity": "sha512-SXlyk6I5eUGBd2v8Ie7tF6ADHE9kCR6mBEuPyH1nUZ0h6Xx6nZI29i12sJKQmzbDyr2tUHMhhTt51Z6blbkTTQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/parser": "^7.28.3",
"@vue/compiler-core": "3.5.21",
......@@ -2501,6 +2503,7 @@
"resolved": "https://registry.npmmirror.com/cytoscape/-/cytoscape-3.33.1.tgz",
"integrity": "sha512-iJc4TwyANnOGR1OmWhsS9ayRS3s+XQ185FmuHObThD+5AeJCakAAbWv8KimMTt08xCCLNgneQwFp+JRJOr9qGQ==",
"license": "MIT",
"peer": true,
"engines": {
"node": ">=0.10"
}
......@@ -2898,6 +2901,7 @@
"resolved": "https://registry.npmmirror.com/d3-selection/-/d3-selection-3.0.0.tgz",
"integrity": "sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==",
"license": "ISC",
"peer": true,
"engines": {
"node": ">=12"
}
......@@ -3155,6 +3159,7 @@
"resolved": "https://registry.npmmirror.com/echarts/-/echarts-5.6.0.tgz",
"integrity": "sha512-oTbVTsXfKuEhxftHqL5xprgLoc0k7uScAwtryCgWF6hPYFLRwOUHiFmHGCBKP5NPFNkDVopOieyUqYGH8Fa3kA==",
"license": "Apache-2.0",
"peer": true,
"dependencies": {
"tslib": "2.3.0",
"zrender": "5.6.1"
......@@ -4388,13 +4393,15 @@
"version": "4.17.21",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
"license": "MIT"
"license": "MIT",
"peer": true
},
"node_modules/lodash-es": {
"version": "4.17.21",
"resolved": "https://registry.npmmirror.com/lodash-es/-/lodash-es-4.17.21.tgz",
"integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
"license": "MIT"
"license": "MIT",
"peer": true
},
"node_modules/lodash-unified": {
"version": "1.0.3",
......@@ -4442,6 +4449,7 @@
"resolved": "https://registry.npmmirror.com/markdown-it/-/markdown-it-14.1.0.tgz",
"integrity": "sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==",
"license": "MIT",
"peer": true,
"dependencies": {
"argparse": "^2.0.1",
"entities": "^4.4.0",
......@@ -5701,6 +5709,7 @@
"integrity": "sha512-BgLRGy7tNS9H66aIMASq1qSYbAAJV6Z6WR4QYTvj5FgF15rZ/ympT1uixHXwzbZUBDbkvqUI1KR0fH1FhMaQ9w==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@types/estree": "1.0.8"
},
......@@ -6634,6 +6643,7 @@
"integrity": "sha512-j3lYzGC3P+B5Yfy/pfKNgVEg4+UtcIJcVRt2cDjIOmhLourAqPqf8P7acgxeiSgUB7E3p2P8/3gNIgDLpwzs4g==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"esbuild": "^0.21.3",
"postcss": "^8.4.43",
......@@ -6693,6 +6703,7 @@
"resolved": "https://registry.npmmirror.com/vue/-/vue-3.5.21.tgz",
"integrity": "sha512-xxf9rum9KtOdwdRkiApWL+9hZEMWE90FHh8yS1+KJAiWYh+iGWV1FquPjoO9VUHQ+VIhsCXNNyZ5Sf4++RVZBA==",
"license": "MIT",
"peer": true,
"dependencies": {
"@vue/compiler-dom": "3.5.21",
"@vue/compiler-sfc": "3.5.21",
......
......@@ -64,6 +64,13 @@ export function getDecreeSummary(params) {
/**
* @param {id}
*/
// export function getDecreeReport(params) {
// return request({
// method: 'GET',
// url: `/api/administrativeOrderInfo/contentUrl/${params.id}`,
// })
// }
export function getDecreeReport(params) {
return request({
method: 'GET',
......
......@@ -198,6 +198,7 @@
'card-white': event.level === 'white',
'card-default': !event.level
}"
:style="event.noData ? 'opacity:0;' : ''"
@click="handleClickEventCard(event)"
>
<div class="card-mask" v-if="activeSanctionId && activeSanctionId !== event.sanctionId"></div>
......@@ -327,13 +328,46 @@ const getUSGovernmentSanctionHistoryData = async () => {
grouped[deptName].events.push({
date: item.endDate ? item.endDate.replace(/^(\d{4})-(\d{2})-(\d{2})$/, "$1年$2月$3日") : "",
time: item.endDate,
content: item.name || item.summary,
tags: item.techDomainList ? item.techDomainList.slice(0, 2) : [],
level: level,
sanctionId: item.sanctionId
});
});
timelineList.value = Object.values(grouped);
//统计完成后生成新的数组
let fArr = []
rawList.forEach((item)=>{
fArr.push(item.endDate)
})
let timeLine = Object.values(grouped);
//重新遍历timeLine,根据日期数组额外增加数据
timeLine.forEach((item) => {
// 根据日期数组构建空数据
const data = []
for (let i = 0; i < fArr.length; i++) {
const option = {
date: fArr[i],
noData: true
}
data.push(option)
}
item.events.forEach((ele) => {
for (let m = 0; m < data.length; m++) {
if(ele.time == data[m].date && data[m].noData){
data[m] = ele
data[m].noData = false
break
}
}
})
item.events = data
})
// timelineList.value = Object.values(grouped);
timelineList.value = timeLine
console.log("timelineList", timelineList.value);
initSlider();
......@@ -2020,6 +2054,10 @@ const prev = () => {
}
}
}
.event-no-card{
width: 240px;
height: 130px;
}
}
}
}
......
......@@ -6,7 +6,7 @@
<img src="./assets/leftbtn.png" alt class="left-btn" @click="prev" :class="{ disabled: startIndex === 0 }" />
<div class="content">
<div class="carousel-container" :style="{ transform: `translateX(-${startIndex * (307 + 16)}px)` }">
<div class="carousel-item" v-for="item,index in carouselList" :key="index">
<div class="carousel-item" v-for="item, index in carouselList" :key="index">
<div class="item-top">
<div class="top-img">
<img :src="ele" :class="{ img1: index !== 0 }" alt v-for="(ele, idx) in item.imageList" :key="idx" />
......@@ -16,20 +16,16 @@
<div class="item-title">{{ item.name }}</div>
<div class="type">
<div class="type-item" :class="getTagClass(ele.industryName)" v-for="ele, idxx in item.industryList" :key="idxx">
<div class="type-item" :class="getTagClass(ele.industryName)" v-for="ele, idxx in item.industryList"
:key="idxx">
{{ ele.industryName }}
</div>
</div>
</div>
</div>
</div>
<img
src="./assets/rightbtn.png"
alt
class="right-btn"
@click="next"
:class="{ disabled: startIndex >= carouselList.length - 5 }"
/>
<img src="./assets/rightbtn.png" alt class="right-btn" @click="next"
:class="{ disabled: startIndex >= carouselList.length - 5 }" />
</div>
<!-- 排华联盟分布 -->
......@@ -51,13 +47,8 @@
<div class="item" v-for="(item, index) in countList" :key="index">
<div class="item-left">
<img :src="item.image" alt />
<el-tooltip
effect="dark"
:content="item.zhName"
popper-class="common-prompt-popper"
placement="top"
:show-after="500"
>
<el-tooltip effect="dark" :content="item.zhName" popper-class="common-prompt-popper" placement="top"
:show-after="500">
<span>{{ item.zhName }}</span>
</el-tooltip>
</div>
......@@ -99,23 +90,19 @@
<span>排华联盟最新动态</span>
</div>
<div class="news-content">
<div class="item" v-for="item,index in newsList" :key="index">
<div class="item" v-for="item, index in newsList" :key="index">
<div class="item-title">
<img :src="item.image || defaultImg" alt />
<span @click="handleClick(item)">{{ item.title }}</span>
</div>
<el-tooltip
effect="dark"
:content="item.content"
popper-class="common-prompt-popper"
placement="top"
:show-after="500"
>
<el-tooltip effect="dark" :content="item.content" popper-class="common-prompt-popper" placement="top"
:show-after="500">
<div class="item-content">{{ item.content }}</div>
</el-tooltip>
<div class="item-bottom">
<div class="bottom-left">
<div class="left-item" :class="getTagClass(ele.industryName)" v-for="ele,idx in item.industryList" :key="idx">
<div class="left-item" :class="getTagClass(ele.industryName)" v-for="ele, idx in item.industryList"
:key="idx">
<span>{{ ele.industryName }}</span>
</div>
</div>
......@@ -134,26 +121,16 @@
<div class="item-title">
<div class="title-left">
<div class="img-list">
<img
:src="ele.image || defaultImg"
:class="{ img1: index !== 0 }"
@error="e => (e.target.src = defaultImg)"
alt
v-for="(ele, index) in item.countryList"
:key="index"
/>
<img :src="ele.image || defaultImg" :class="{ img1: index !== 0 }"
@error="e => (e.target.src = defaultImg)" alt v-for="(ele, index) in item.countryList"
:key="index" />
</div>
<div class="left-content">{{ getContent(item.countryList) }}</div>
</div>
<div class="title-right">{{ item.statementList?.length }}次合作</div>
</div>
<div class="item-content">
<div
class="content-list"
v-for="(ele, idx) in item.statementList"
:key="idx"
@click="handleClick(ele)"
>
<div class="content-list" v-for="(ele, idx) in item.statementList" :key="idx" @click="handleClick(ele)">
<div class="list-left" :class="getTagClass(getName(ele.industryList))">
<span>{{ getName(ele.industryList) }}</span>
</div>
......@@ -715,7 +692,7 @@ function createChart() {
...item,
name: nameMap[item.name] || item.name, // 将英文名转换为中文名以匹配地图区域
itemStyle: {
color: color
// color: color
},
emphasis: {
itemStyle: {
......@@ -949,8 +926,10 @@ const initRightDonut = async () => {
for (let i = 0; i < res.data.length; i++) {
let item = {
name: res.data[i].country,
value: res.data[i].amount,
x: Math.random() * 10,
y: Math.random() * 10,
symbolSize: res.data[i].amount * 9,
// 节点颜色
itemStyle: {
color: `rgba(${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)}, ${Math.floor(
......@@ -960,8 +939,10 @@ const initRightDonut = async () => {
};
let item1 = {
name: res.data[i].relationCountry,
value: res.data[i].amount,
x: Math.random() * 10,
y: Math.random() * 10
y: Math.random() * 10,
symbolSize: res.data[i].amount * 9,
};
// 先判断data中是否包含上述数据
......@@ -1000,7 +981,21 @@ const initRightDonut = async () => {
title: {
// text: 'Basic Graph'
},
tooltip: {},
tooltip: {
trigger: 'item', // 针对Graph的节点/边触发(必配,否则弹框不生效)
triggerOn: 'click',
formatter: function (params) {
// params.data 是当前点击节点的完整数据对象
const { name, value } = params.data;
// 返回HTML字符串,自由拼接展示内容(支持换行、标签、样式)
return `
<div style="text-align: center;">
<span style="font-size:16px; font-weight: bold; margin-bottom:8px;">${name}</span>
<span>:${value || 0}</span>
</div>
`;
}
},
animationDurationUpdate: 1500,
animationEasingUpdate: "quinticInOut",
dataZoom: [
......@@ -1020,7 +1015,7 @@ const initRightDonut = async () => {
show: true
},
edgeSymbol: ["circle", ""],
edgeSymbolSize: [4, 10],
edgeSymbolSize: [4, 40],
edgeLabel: {
fontSize: 20
},
......@@ -1035,6 +1030,24 @@ const initRightDonut = async () => {
}
]
};
// const option = {
// center: ["40%", "25%"],
// backgroundColor: "transparent",
// animation: true,
// series: [
// {
// type: "graph",
// layout: "none",
// roam: false,
// label: { show: true, position: "inside", color: "#fff", fontWeight: 700 },
// data: data,
// links: links,
// edgeSymbol: ["none", "none"],
// lineStyle: { color: "rgba(207,223,255,0.7)", width: 3 },
// emphasis: { focus: "adjacency" }
// }
// ]
// };
rightChart.setOption(option);
};
......@@ -1297,6 +1310,7 @@ watch(activeDate, async () => {
display: flex;
align-items: center;
position: relative;
.content {
width: 1601px;
overflow: hidden;
......@@ -1336,6 +1350,7 @@ watch(activeDate, async () => {
height: 24px;
border-radius: 50%;
}
.img1 {
margin-left: -8px;
}
......@@ -1373,6 +1388,7 @@ watch(activeDate, async () => {
overflow-y: hidden;
width: calc(100% - 22px);
height: 25px;
.type-item {
display: inline-block;
border-radius: 4px;
......@@ -1387,6 +1403,7 @@ watch(activeDate, async () => {
}
}
}
.left-btn {
width: 24px;
height: 48px;
......@@ -1400,6 +1417,7 @@ watch(activeDate, async () => {
cursor: not-allowed;
}
}
.right-btn {
width: 24px;
height: 48px;
......@@ -1422,6 +1440,7 @@ watch(activeDate, async () => {
border-radius: 10px;
background-color: rgba(255, 255, 255, 0.65);
box-shadow: 0 0 20px rgba(25, 69, 130, 0.1);
.anti-title {
width: 100%;
height: 48px;
......@@ -1432,9 +1451,11 @@ watch(activeDate, async () => {
justify-content: space-between;
box-sizing: border-box;
background: linear-gradient(180deg, rgba(231, 243, 255, 1) 0%, rgba(231, 243, 255, 0) 100%);
.title-left {
display: flex;
align-items: center;
img {
width: 17px;
height: 17px;
......@@ -1492,6 +1513,7 @@ watch(activeDate, async () => {
margin-left: 38px;
margin-top: 31px;
margin-bottom: 55px;
.count-box {
height: 520px;
display: flex;
......@@ -1516,6 +1538,7 @@ watch(activeDate, async () => {
/* 业务系统/模态背景模糊 */
backdrop-filter: blur(30px);
background: rgba(255, 255, 255, 0.65);
.item-left {
display: flex;
align-items: center;
......@@ -1525,6 +1548,7 @@ watch(activeDate, async () => {
height: 12px;
margin-right: 12px;
}
span {
display: inline-block;
width: 100px;
......@@ -1536,9 +1560,12 @@ watch(activeDate, async () => {
line-height: 30px;
letter-spacing: 0px;
text-align: left;
white-space: nowrap; /* 防止文本换行 */
overflow: hidden; /* 隐藏溢出的内容 */
text-overflow: ellipsis; /* 显示省略符号来代表被修剪的文本 */
white-space: nowrap;
/* 防止文本换行 */
overflow: hidden;
/* 隐藏溢出的内容 */
text-overflow: ellipsis;
/* 显示省略符号来代表被修剪的文本 */
}
}
......@@ -1560,17 +1587,20 @@ watch(activeDate, async () => {
display: flex;
justify-content: center;
gap: 8px;
.left {
width: 24px;
height: 24px;
border-radius: 4px;
overflow: hidden;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.center {
height: 24px;
color: var(--color-main-active);
......@@ -1582,12 +1612,14 @@ watch(activeDate, async () => {
letter-spacing: 0px;
text-align: center;
}
.right {
width: 24px;
height: 24px;
border-radius: 4px;
overflow: hidden;
cursor: pointer;
img {
width: 100%;
height: 100%;
......@@ -1675,6 +1707,7 @@ watch(activeDate, async () => {
display: flex;
align-items: center;
cursor: pointer;
img {
width: 20px;
height: 20px;
......@@ -1705,9 +1738,12 @@ watch(activeDate, async () => {
line-height: 30px;
letter-spacing: 0px;
text-align: justify;
white-space: nowrap; /* 防止文本换行 */
overflow: hidden; /* 隐藏溢出的内容 */
text-overflow: ellipsis; /* 显示省略符号来代表被修剪的文本 */
white-space: nowrap;
/* 防止文本换行 */
overflow: hidden;
/* 隐藏溢出的内容 */
text-overflow: ellipsis;
/* 显示省略符号来代表被修剪的文本 */
}
.item-bottom {
......@@ -1874,9 +1910,11 @@ watch(activeDate, async () => {
align-items: center;
justify-content: space-around;
cursor: pointer;
&:hover {
background: var(--color-bg-hover);
}
.list-left {
/* 数据展示/Tag标签/亮色/绿 */
min-width: 75px;
......@@ -1911,9 +1949,12 @@ watch(activeDate, async () => {
line-height: 30px;
letter-spacing: 0px;
text-align: left;
white-space: nowrap; /* 防止文本换行 */
overflow: hidden; /* 隐藏溢出的内容 */
text-overflow: ellipsis; /* 显示省略符号来代表被修剪的文本 */
white-space: nowrap;
/* 防止文本换行 */
overflow: hidden;
/* 隐藏溢出的内容 */
text-overflow: ellipsis;
/* 显示省略符号来代表被修剪的文本 */
// margin-left: 13px;
// margin-right: 13px;
}
......@@ -1942,6 +1983,7 @@ watch(activeDate, async () => {
display: flex;
align-items: center;
justify-content: space-between;
.area-left {
width: 792px;
height: 500px;
......
......@@ -57,15 +57,19 @@
<el-table-column prop="usScore" label="美国">
<template #default="scope">
<div style="display: flex">
<div class="progress-text">
<div class="rank">{{ "No." + scope.row.usRank }}</div>
<div class="score">{{ scope.row.usScore }}</div>
<div class="progress-text" style="width:90px;">
<div class="rank" v-show="scope.row.usScore != 0">{{ "No." + scope.row.usRank }}</div>
<div class="score" v-show="scope.row.usScore != 0">{{ scope.row.usScore }}</div>
</div>
<div class="progress-wrapper left">
<el-progress
:percentage="scope.row.usScore"
:stroke-width="20"
class="left-progress"
:class="{
cLead: scope.row.usScore == 0,
leftProgress: scope.row.usScore != 0
}"
:show-text="false"
/>
</div>
......@@ -80,15 +84,15 @@
:percentage="scope.row.chinaScore"
:stroke-width="20"
class="right-progress"
:class="{ cLead: scope.row.chinaRank < scope.row.usRank }"
:class="{ cLead: scope.row.chinaRank < scope.row.usRank && scope.row.chinaScore != 0}"
:show-text="false"
/>
</div>
<div class="progress-text" style="color: rgba(206, 79, 81, 1)">
<div class="rank" :class="{ cLeadRank: scope.row.chinaRank < scope.row.usRank }">
<div class="progress-text" style="color: rgba(206, 79, 81, 1);width:90px;">
<div class="rank" :class="{ cLeadRank: scope.row.chinaRank < scope.row.usRank }" v-show="scope.row.chinaScore != 0">
{{ "No." + scope.row.chinaRank }}
</div>
<div class="score" :class="{ cLeadScore: scope.row.chinaRank < scope.row.usRank }">
<div class="score" :class="{ cLeadScore: scope.row.chinaRank < scope.row.usRank }" v-show="scope.row.chinaScore != 0">
{{ scope.row.chinaScore }}
</div>
</div>
......
......@@ -155,6 +155,10 @@ const selectRelation = ref("相关度优先");
const keyword = ref("");
const tabList = ref([
{
name: "全部",
id: 100
},
{
name: "法案",
id: 1
......@@ -296,7 +300,7 @@ const handleSearch = async () => {
size: pageSize.value,
page: currentPage.value,
keyword: keyword.value, // "出口"
type: activeTabId.value,
type: activeTabId.value == 100 ? '' : activeTabId.value,
domains: selectedDomains.value
};
} else {
......@@ -476,6 +480,9 @@ onMounted(() => {
if (route.query && route.query.areaName) {
curArea.value = route.query.areaName;
switch (curArea.value) {
case "全部":
activeTabId.value = 100;
break;
case "法案":
activeTabId.value = 1;
break;
......@@ -503,6 +510,9 @@ onMounted(() => {
default:
activeTabId.value = 5;
}
} else {
curArea.value = "全部"
activeTabId.value = 100;
}
handleSearch();
});
......
......@@ -113,8 +113,7 @@
</div>
</div>
<div class="home-main-header-item-box">
<div class="item" v-for="(item, index) in govInsList" :key="index"
@click="handleToInstitution(item)">
<div class="item" v-for="(item, index) in govInsList" :key="index" @click="handleToInstitution(item)">
<div class="item-left">
<img :src="item.img ? item.img : DefaultIcon2" alt="" />
</div>
......@@ -156,7 +155,7 @@
<div v-else class="box1-main-left-img-mock">
<img class="img-mock-badge-img" src="./assets/images/badge.png">
<p class="img-mock-badge-title">行政令</p>
<p class="img-mock-badge-title">{{item.name}}</p>
<p class="img-mock-badge-title">{{ item.name }}</p>
<!-- <p class="img-mock-badge-org">The White House</p> -->
</div>
</div>
......@@ -240,8 +239,7 @@
</div>
</div>
<div class="box3-main">
<div class="box3-item" v-for="(news, index) in newsList" :key="index"
@click="handleToNewsAnalysis(news)">
<div class="box3-item" v-for="(news, index) in newsList" :key="index" @click="handleToNewsAnalysis(news)">
<div class="left">
<img :src="news.img ? news.img : DefaultIconNews" alt="" />
</div>
......@@ -269,9 +267,8 @@
</div>
<div class="box4-main">
<MessageBubble v-for="(item, index) in messageList" @click="handleClickPerson(item)"
@info-click="handleMediaClick(item)" :key="index"
:avatar="item.img ? item.img : DefaultIcon1" :name="item.name" :time="item.time"
:source="item.source" :content="item.content" />
@info-click="handleMediaClick(item)" :key="index" :avatar="item.img ? item.img : DefaultIcon1"
:name="item.name" :time="item.time" :source="item.source" :content="item.content" />
<!-- <div class="box4-main-item" v-for="(item, index) in messageList" :key="index">
<div class="left" @click="handleClickPerson(item)">
<img :src="item.img ? item.img : DefaultIcon1" alt="" />
......@@ -300,8 +297,7 @@
<div class="box5-selectbox">
<el-select @change="handleBox5YearChange" v-model="box5SelectedYear" placeholder="选择时间"
style="width: 120px">
<el-option v-for="item in box5YearList" :key="item.value" :label="item.label"
:value="item.value" />
<el-option v-for="item in box5YearList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
</div>
......@@ -319,8 +315,7 @@
<div class="box6-selectbox">
<el-select @change="handleBox6YearChange" v-model="box6SelectedYear" placeholder="选择时间"
style="width: 120px">
<el-option v-for="item in box6YearList" :key="item.value" :label="item.label"
:value="item.value" />
<el-option v-for="item in box6YearList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
</div>
......@@ -336,8 +331,7 @@
<div class="header-title">{{ "关键行政令" }}</div>
</div>
<div class="box7-main">
<div class="box7-item" v-for="(item, index) in keyDecreeList" :key="index"
@click="handleKeyDecree(item)">
<div class="box7-item" v-for="(item, index) in keyDecreeList" :key="index" @click="handleKeyDecree(item)">
<div class="icon">
<img src="./assets/images/warning.png" alt="" />
</div>
......@@ -393,9 +387,9 @@
</div>
<div class="select-main">
<div class="checkbox-group">
<el-checkbox v-for="type in decreeTypeList" :key="type.id"
v-model="checkedDecreeType" :label="type.typeId" style="width: 180px"
class="filter-checkbox" @change="handleChangeCheckedDecreeType">
<el-checkbox v-for="type in decreeTypeList" :key="type.id" v-model="checkedDecreeType"
:label="type.typeId" style="width: 180px" class="filter-checkbox"
@change="handleChangeCheckedDecreeType">
{{ type.typeName }}
</el-checkbox>
</div>
......@@ -408,9 +402,8 @@
</div>
<div class="select-main">
<div class="checkbox-group">
<el-checkbox v-for="cate in govInsList" :key="cate.id" v-model="checkedGovIns"
:label="cate.id" style="width: 180px" class="filter-checkbox"
@change="handleChangeCheckedGovIns">
<el-checkbox v-for="cate in govInsList" :key="cate.id" v-model="checkedGovIns" :label="cate.id"
style="width: 180px" class="filter-checkbox" @change="handleChangeCheckedGovIns">
{{ cate.name }}
</el-checkbox>
</div>
......@@ -423,8 +416,9 @@
</div>
<div class="select-main">
<div class="checkbox-group">
<el-checkbox v-for="time in pubTime" :key="time.id" v-model="activePubTime"
:label="time.id" style="width: 100px" class="filter-checkbox">
<el-checkbox v-for="time in pubTime" :key="time.id" v-model="activePubTime" :label="time.id"
style="width: 100px" class="filter-checkbox"
@change="(checked) => handlePubTimeChange(time.id, checked)">
{{ time.name }}
</el-checkbox>
</div>
......@@ -437,8 +431,8 @@
</div>
<div class="select-main select-main1">
<div class="checkbox-group">
<el-checkbox v-for="area in areaList" :key="area.id" v-model="activeAreaList"
:label="area.id" style="width: 100px">
<el-checkbox v-for="area in areaList" :key="area.id" v-model="activeAreaList" :label="area.id"
style="width: 100px" @change="(checked) => handleAreaChange(area.id, checked)">
{{ area.name }}
</el-checkbox>
</div>
......@@ -457,7 +451,8 @@
@click="handleClickDecree(item)">
<div class="main-item-left">
<div class="left-left">{{ item.time.split('-')[0] }}<br>{{ item.time.split('-')[1]}}月{{ item.time.split('-')[2] }}日</div>
<div class="left-left">{{ item.time.split('-')[0] }}<br>{{ item.time.split('-')[1] }}月{{
item.time.split('-')[2] }}日</div>
<div class="left-right">
<div class="icon">
<img :src="item.orgImage ? item.orgImage : DefaultIcon2" alt="" />
......@@ -493,9 +488,8 @@
{{ `共 ${totalDecreesNum} 项` }}
</div>
<div class="footer-right">
<el-pagination @current-change="handleCurrentChange" :pageSize="10"
:current-page="currentPage" background layout="prev, pager, next"
:total="totalDecreesNum" />
<el-pagination @current-change="handleCurrentChange" :pageSize="10" :current-page="currentPage"
background layout="prev, pager, next" :total="totalDecreesNum" />
</div>
</div>
</div>
......@@ -1079,7 +1073,7 @@ const handleBox8 = async () => {
};
// 资源库
const isSort = ref(true); // true 升序 false 倒序
const isSort = ref(false); // true 升序 false 倒序
const handleSwithSort = () => {
isSort.value = !isSort.value;
};
......@@ -1114,21 +1108,21 @@ const areaList = ref([
// { id: "量子科技", name: "量子科技" }
]);
const activeAreaList = ref(["1"]);
const handleGetAreaList = async () => {
try {
const res = await getDecreehylyList();
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 handleGetAreaList = async () => {
// try {
// const res = await getDecreehylyList();
// 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 decreeTypeList = ref([]);
......@@ -1149,6 +1143,7 @@ const handleChangeCheckedDecreeType = () => {
}
const pubTime = ref([
{ id: "all", name: "全选" },
{ id: "2026", name: "2026年" },
{ id: "2025", name: "2025年" },
{ id: "2024", name: "2024年" },
......@@ -1156,27 +1151,111 @@ const pubTime = ref([
{ id: "2022", name: "2022年" },
{ id: "2021", name: "2021年" },
{ id: "2020", name: "2020年" }
// { id: "更早时间", name: "更早时间" }
]);
const activePubTime = ref(["2026"]);
// 处理发布时间全选逻辑
const handlePubTimeChange = (id, checked) => {
const allIds = pubTime.value.filter(item => item.id !== 'all').map(item => item.id);
if (id === 'all') {
// 点击全选:选中所有或清空所有
activePubTime.value = checked ? ['all', ...allIds] : [];
} else {
const selectedIds = activePubTime.value.filter(itemId => itemId !== 'all');
const isAllSelected = selectedIds.length === allIds.length;
if (isAllSelected && !activePubTime.value.includes('all')) {
// 手动选中了所有年份,自动勾选全选
activePubTime.value = ['all', ...allIds];
} else if (!isAllSelected && activePubTime.value.includes('all')) {
// 取消某个选项,取消全选状态
activePubTime.value = selectedIds;
}
}
};
const handleAreaChange = (id, checked) => {
const allIds = areaList.value.filter(item => item.id !== 'all').map(item => item.id);
if (id === 'all') {
activeAreaList.value = checked ? ['all', ...allIds] : [];
} else {
const selectedIds = activeAreaList.value.filter(itemId => itemId !== 'all');
const isAllSelected = selectedIds.length === allIds.length;
if (isAllSelected && !activeAreaList.value.includes('all')) {
activeAreaList.value = ['all', ...allIds];
} else if (!isAllSelected && activeAreaList.value.includes('all')) {
activeAreaList.value = selectedIds;
}
}
};
// 修改获取涉及领域列表,添加全选选项
const handleGetAreaList = async () => {
try {
const res = await getDecreehylyList();
console.log("行业领域列表", res);
if (res.code === 200 && res.data) {
areaList.value = [
{ name: "全选", id: "all" },
...res.data.map(item => {
return {
name: item.name,
id: item.id
};
})
];
// 设置默认全选
activeAreaList.value = ['all', ...res.data.map(item => item.id)];
console.log("areaList", areaList.value);
// 获取列表后重新查询
handleGetDecreeOrderList();
}
} catch (error) { }
};
const totalDecreesNum = ref(0);
const decreeList = ref([]);
// 修改请求方法,处理全选时不传参数的情况
const handleGetDecreeOrderList = async () => {
const p0 = checkedGovIns.value.join(",");
const p1 = activeAreaList.value.join(",");
const p2 = activePubTime.value.join(",");
// 处理涉及领域:如果包含 all 或全选,则 researchTypeIds 为空(不传)
let p1 = '';
const allAreaIds = areaList.value.filter(item => item.id !== 'all').map(item => item.id);
const selectedAreaIds = activeAreaList.value.filter(id => id !== 'all');
if (!activeAreaList.value.includes('all') && selectedAreaIds.length > 0 && selectedAreaIds.length < allAreaIds.length) {
p1 = selectedAreaIds.join(",");
}
// 其他情况(包含all、长度为0、全部选中)p1保持为空,即不传researchTypeIds
// 处理发布时间:如果包含 all 或全选,则 years 为空(不传)
let p2 = '';
const allPubTimeIds = pubTime.value.filter(item => item.id !== 'all').map(item => item.id);
const selectedPubTimeIds = activePubTime.value.filter(id => id !== 'all');
if (!activePubTime.value.includes('all') && selectedPubTimeIds.length > 0 && selectedPubTimeIds.length < allPubTimeIds.length) {
p2 = selectedPubTimeIds.join(",");
}
// 其他情况(包含all、长度为0、全部选中)p2保持为空,即不传years
console.log(activePubTime.value, 'activePubTime.value')
const params = {
currentPage: currentPage.value,
pageSize: pageSize.value,
proposeName: p0,
researchTypeIds: p1,
researchTypeIds: p1, // 全选时不传(为空)
sortFun: isSort.value,
years: p2,
years: p2, // 全选时不传(为空)
typeIds: checkedDecreeType.value.toString()
};
try {
const res = await getDecreeOrderList(params);
console.log("资源库列表", res);
......@@ -1192,14 +1271,14 @@ const handleGetDecreeOrderList = async () => {
tagList: item.industryList
};
});
console.log("decreeList", decreeList.value);
} else {
decreeList.value = [];
totalDecreesNum.value = 0;
}
} catch (error) {
console.error("资源库列表error", error);
decreeList.value = [];
totalDecreesNum.value = 0;
}
};
......@@ -3230,7 +3309,7 @@ onMounted(async () => {
gap: 16px;
.left {
width: 300px;
width: 360px;
// height: 666px;
box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
background: rgba(255, 255, 255, 1);
......@@ -3496,4 +3575,20 @@ onMounted(async () => {
:deep(.el-input__wrapper.is-focus) {
box-shadow: none !important;
}
:deep(.el-checkbox__label) {
color: rgba(95, 101, 108, 1);
font-family: Source Han Sans CN;
font-style: Regular;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: justify;
}
:deep(.el-checkbox__input.is-checked+.el-checkbox__label) {
color: rgba(95, 101, 108, 1);
}
</style>
......@@ -33,14 +33,15 @@
{{ "政令原文" }}
</div>
<div class="report-main">
<div class="left">
<div v-if="!reportUrl" class="noContent">{{ "中文原文暂无数据" }}</div>
<iframe v-else :src="reportUrl" style="border: none" width="100%" height="100%"> </iframe>
</div>
<div class="right">
<div v-if="!reportUrlEn" class="noContent">{{ "英文原文暂无数据" }}</div>
<iframe v-else :src="reportUrlEn" style="border: none" width="100%" height="100%"> </iframe>
<div v-if="!reportData.length" class="noContent">{{ "暂无数据" }}</div>
<template v-else>
<div v-for="(item, index) in reportData" :key="index" class="content-row">
<!-- 左侧:英文 -->
<div class="content-en">{{ item.contentEn }}</div>
<!-- 右侧:中文 -->
<div class="content-cn">{{ item.content }}</div>
</div>
</template>
</div>
</div>
</div>
......@@ -50,14 +51,13 @@
<script setup>
import { ref, onMounted } from "vue";
import { useRoute } from "vue-router";
import { getDecreeSummary } from "@/api/decree/introduction";
import { getDecreeReport } from "@/api/decree/introduction";
const route = useRoute();
const reportUrl = ref("");
const reportUrlEn = ref("");
// 修改为数组存储分段数据
const reportData = ref([]);
const summaryInfo = ref({});
......@@ -72,10 +72,10 @@ const handleGetSummary = async () => {
if (res.code === 200 && res.data) {
summaryInfo.value = res.data;
}
} catch (error) {}
} catch (error) { }
};
// 获取报告原文
// 获取报告原文 - 修改为获取分段数组
const handleGetReport = async () => {
const params = {
id: route.query.id
......@@ -85,10 +85,10 @@ const handleGetReport = async () => {
const res = await getDecreeReport(params);
console.log("报告原文", res);
if (res.code === 200 && res.data) {
reportUrl.value = res.data.content;
reportUrlEn.value = res.data.contentEn;
// 假设后端返回的是数组格式,如果返回的是对象包含数组,请改为 res.data.list
reportData.value = res.data || [];
}
} catch (error) {}
} catch (error) { }
};
onMounted(() => {
......@@ -106,6 +106,7 @@ onMounted(() => {
.layout-main {
width: 100%;
.layout-main-header {
height: 120px;
background: rgba(255, 255, 255, 1);
......@@ -119,26 +120,32 @@ onMounted(() => {
border-top: 1px solid rgba(234, 236, 238, 1);
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1);
.layout-main-header-left-box {
width: 1100px;
margin-left: 160px;
margin-top: 13px;
.left-box-top {
height: 64px;
display: flex;
.icon {
width: 122px;
height: 64px;
border-radius: 4px;
overflow: hidden;
img {
width: 100%;
height: 100%;
}
}
.info {
width: 700px;
margin-left: 9px;
.info-box1 {
width: 700px;
color: rgba(59, 65, 75, 1);
......@@ -153,6 +160,7 @@ onMounted(() => {
text-overflow: ellipsis;
white-space: nowrap;
}
.info-box2 {
margin-top: 5px;
height: 22px;
......@@ -166,21 +174,25 @@ onMounted(() => {
text-align: left;
display: flex;
margin-left: -10px;
.info-box2-item {
padding: 0 10px;
}
.item1 {
width: 100px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.item2 {
width: 180px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.item3 {
width: 420px;
overflow: hidden;
......@@ -190,25 +202,30 @@ onMounted(() => {
}
}
}
.left-box-bottom {
display: flex;
height: 40px;
margin-top: 21px;
.left-box-bottom-item {
display: flex;
margin-right: 32px;
margin-top: 3px;
height: 35px;
cursor: pointer;
.icon {
margin-top: 4px;
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.name {
height: 24px;
color: rgba(59, 65, 75, 1);
......@@ -220,20 +237,24 @@ onMounted(() => {
text-align: left;
margin-left: 3px;
}
.nameActive {
color: var(--color-main-active);
font-weight: 700;
}
}
.leftBoxBottomItemActive {
border-bottom: 3px solid var(--color-main-active);
}
}
}
.layout-main-header-right-box {
width: 300px;
margin-right: 150px;
margin-top: 19px;
.right-box-top {
.time {
height: 24px;
......@@ -246,6 +267,7 @@ onMounted(() => {
letter-spacing: 0px;
text-align: right;
}
.name {
height: 24px;
line-height: 24px;
......@@ -258,12 +280,14 @@ onMounted(() => {
text-align: right;
}
}
.right-box-bottom {
margin-top: 24px;
text-align: right;
display: flex;
justify-content: flex-end;
gap: 8px;
.btn {
width: 120px;
height: 36px;
......@@ -276,14 +300,17 @@ onMounted(() => {
gap: 8px;
align-items: center;
cursor: pointer;
.icon {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
width: 64px;
height: 24px;
......@@ -297,6 +324,7 @@ onMounted(() => {
text-align: left;
}
}
.btn-active {
width: 120px;
height: 36px;
......@@ -307,14 +335,17 @@ onMounted(() => {
align-items: center;
gap: 8px;
cursor: pointer;
.icon-active {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text-active {
width: 64px;
height: 24px;
......@@ -331,16 +362,18 @@ onMounted(() => {
}
}
}
.layout-main-center {
.report-box {
margin: 0 auto;
width: 1600px;
height: 926px;
background: rgba(248, 249, 250, 1);
.report-header {
height: 80px;
line-height: 80px;
padding-left: 20px;
padding-left: 69px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-style: Bold;
......@@ -349,39 +382,68 @@ onMounted(() => {
letter-spacing: 0px;
text-align: left;
}
.report-main {
width: 1600px;
margin: 0 auto;
margin-top: 24px;
background: #fff;
box-sizing: border-box;
padding: 0 69px;
display: flex;
padding: 24px 69px;
height: calc(100% - 100px);
justify-content: space-between;
.left {
width: 800px;
overflow-y: auto; // 改为单一滚动容器,天然同步
// 滚动条样式
&::-webkit-scrollbar {
display: none;
}
&::-webkit-scrollbar-thumb {
background: #c1c1c1;
border-radius: 4px;
}
&::-webkit-scrollbar-track {
background: #f1f1f1;
}
.noContent {
height: 100px;
line-height: 100px;
text-align: center;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-style: Regular;
font-size: 20px;
font-weight: 400;
}
.content-row {
display: flex;
width: 100%;
min-height: 100px;
// border-bottom: 1px solid rgba(234, 236, 238, 1);
align-items: stretch; // 默认stretch,确保左右等高,头部对齐
&:last-child {
border-bottom: none;
}
.right {
.content-en,
.content-cn {
width: 800px;
.noContent {
height: 100px;
line-height: 100px;
text-align: center;
padding: 24px 30px;
box-sizing: border-box;
font-size: 16px;
line-height: 1.8;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-style: Regular;
font-size: 20px;
font-weight: 400;
text-align: justify;
white-space: pre-wrap; // 保留换行格式
}
.content-en {
// border-right: 1px solid rgba(234, 236, 238, 1); // 中间分隔线
}
}
}
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论