提交 9f6eba98 authored 作者: 李顺's avatar 李顺

[update]:完成部分规则限制接口对接以及页面优化

上级 671ea177
import request from "@/api/request.js";
// 规则限制-首页统计接口
export function getStatCount() {
return request({
method: 'GET',
url: `/api/ruleLimitInfo/statCount`
})
}
// 规则限制-查询最新动态接口
export function getLatestUpdates() {
return request({
method: 'GET',
url: `/api/ruleLimitInfo/getLatestUpdates`
})
}
// 规则限制-风险信号
export function getRiskSignal(params) {
return request({
method: 'GET',
url: `/api/commonFeature/riskSignal/${params}`
})
}
// 规则限制-查询新闻资讯
export function getNews(params) {
return request({
method: 'GET',
url: `/api/commonFeature/news/${params}`
})
}
// 规则限制-查询社交媒体
export function getRemarks(params) {
return request({
method: 'GET',
url: `/api/commonFeature/remarks/${params}`
})
}
// 规则限制-限制领域分布情况
/**
* @param {Object} params
* @param {string} params.year
* @header token
*/
export function getAreaDistribution(params) {
return request({
method: 'GET',
url: `/api/ruleLimitInfo/getAreaDistribution`,
params
})
}
// 规则限制-受限实体数量变化趋势
/**
* @param {Object} params
* @param {Integer} params.year
* @param {String} params.type
* @header token
*/
export function getEntityChangeTrend(params) {
return request({
method: 'GET',
url: `/api/ruleLimitInfo/getEntityChangeTrend`,
params
})
}
// 规则限制-规则限制政令列表查询接口
/**
* @param {Object} params
* @param {Integer} params.currentPage
* @param {Integer} params.pageSize
* @param {List<String>} params.years
* @param {List<String>} params.areas
* @param {String} params.keywords
* @param {String} params.sortField
* @param {String} params.sortOrder
* @header token
*/
export function getRuleLimitList(params) {
return request({
method: 'GET',
url: `/api/ruleLimitInfo/getRuleLimitList`,
params
})
}
// 规则限制-排华科技联盟列表接口
/**
* @param {Object} params
* @param {Integer} params.currentPage
* @param {Integer} params.pageSize
* @param {List<String>} params.years
* @param {List<String>} params.countries
* @param {List<String>} params.areas
* @param {String} params.keywords
* @param {String} params.sortField
* @param {String} params.sortOrder
* @header token
*/
export function getACTAList(params) {
return request({
method: 'GET',
url: `/api/ruleLimitInfo/getACTAList`,
params
})
}
export function getAcTAAllcountry() {
return request({
method: 'GET',
url: `/api/ruleLimitInfo/getACTAAllCountry/`
})
}
// 规则限制-规则限制基本详情
export function getSanctionOverview(params) {
return request({
method: 'GET',
url: `/api/ruleLimitInfo/getSanctionOverview/${params}`
})
}
// 实体清单-制裁概况-获取发布机构机构动态
/**
* @param {Object} data
* @param {string} data.orgId
* @header token
*/
export function getPublishOrgInfo(data) {
return request({
method: 'POST',
url: `/api/organization/relate/news`,
data,
})
}
\ No newline at end of file
...@@ -107,6 +107,7 @@ const getMainDataList = async () => { ...@@ -107,6 +107,7 @@ const getMainDataList = async () => {
} }
try { try {
console.log('----params getMainDataList', params)
const res = await getCoopRestrictionList(params); const res = await getCoopRestrictionList(params);
if (res && res.code === 200) { if (res && res.code === 200) {
mainDataList.value = (res.data.content || []).map(item => ({ mainDataList.value = (res.data.content || []).map(item => ({
......
<template> <template>
<div class="data-new"> <div class="data-new">
<div class="left"> <div class="left">
<img src="./assets/leftbtn.png" alt="" class="left-btn" /> <img src="./assets/leftbtn.png" alt class="left-btn" @click="changeIndex(-1)" />
<img src="./assets/rightbtn.png" alt="" class="right-btn" /> <img src="./assets/rightbtn.png" alt class="right-btn" @click="changeIndex(1)" />
<div class="left-top"> <div class="left-top">
<img src="./assets/icon01.png" alt="" /> <img src="./assets/icon01.png" alt />
<div class="left-top-title">规则限制动态</div> <div class="left-top-title">规则限制动态</div>
<div class="more" @click="handleClickToDetail">查看详情 ></div> <div class="more" @click="handleClickToDetail">查看详情 ></div>
</div> </div>
<div class="left-center"> <div class="left-center">
<img src="./assets/usImg.png" alt="" /> <img src="./assets/usImg.png" alt />
<div class="left-center-main"> <div class="left-center-main">
<div class="left-center-main-title"> <div class="left-center-main-title">{{ latestUpdateList[latestUpdateIndex].RULENAMEZH }}</div>
美国联邦通信委员会(FCC)启动撤销重庆信息通信研究院作为认可测试实验室资格的程序
</div>
<div class="left-center-main-ul"> <div class="left-center-main-ul">
<ul> <ul>
<li> <li>
<span class="ul-title">发布机构:</span> <span class="ul-title">发布机构:</span>
<span class="ul-content">美国联邦通信委员会(FCC)工程技术与媒体关系部</span> <span class="ul-content">{{ latestUpdateList[latestUpdateIndex].PUBLISHORGNAME }}</span>
</li> </li>
<li> <li>
<span class="ul-title">发布日期:</span> <span class="ul-title">发布日期:</span>
<span class="ul-content">2025年10月24日</span> <span class="ul-content">{{ latestUpdateList[latestUpdateIndex].PUBLISHDATE }}</span>
</li> </li>
<li> <li>
<span class="ul-title">涉及领域:</span> <span class="ul-title">涉及领域:</span>
<span class="ul-pie cl1">能源</span> <span
<span class="ul-pie cl2">集成电路</span> class="ul-pie cl1"
v-for="item in latestUpdateList[latestUpdateIndex].ruleAreas"
>{{ item }}</span>
<!-- <span class="ul-pie cl2">集成电路</span>
<span class="ul-pie cl3">新材料</span> <span class="ul-pie cl3">新材料</span>
<span class="ul-pie cl4">生物科技</span> <span class="ul-pie cl4">生物科技</span>-->
</li> </li>
<li> <li>
<span class="ul-title">限制实体:</span> <span class="ul-title">限制实体:</span>
<span class="ul-content">重庆信息通信研究院</span> <span
class="ul-content"
v-for="item in latestUpdateList[latestUpdateIndex].ruleEntities"
>{{ item.ORGNAME }} &nbsp;</span>
</li> </li>
</ul> </ul>
</div> </div>
...@@ -44,30 +48,29 @@ ...@@ -44,30 +48,29 @@
<ul> <ul>
<li class="left-bottom-li">内容摘要:</li> <li class="left-bottom-li">内容摘要:</li>
</ul> </ul>
<div class="left-bottom-content"> <div class="left-bottom-content">{{ latestUpdateList[latestUpdateIndex].RULEINTRODUCTION }}</div>
工程和技术办公室着手撤销对德国莱茵 TÜV 集团/中国检验认证集团(宁波)有限公司作为认可测试实验室的资格。
</div>
</div> </div>
</div> </div>
<div class="right"> <div class="right">
<div class="right-top"> <div class="right-top">
<img src="./assets/icon02.png" alt="" /> <img src="./assets/icon02.png" alt />
<div class="right-top-title"> <div class="right-top-title">
风险信号 风险信号
<span>4</span> <span>{{ list.length }}</span>
</div> </div>
</div> </div>
<div style="margin: 6px 34px 0 23px"> <div style="margin: 6px 34px 0 23px">
<div v-for="item in list" :key="item.id" class="right-main" @click="handleClickToDetail"> <div v-for="(item, index) in list" :key="index" class="right-main">
<div class="main-left" :class="{ cl4: item.title === '特别重大', cl5: item.title === '重大风险' }"> <div
{{ item.title }} class="main-left"
</div> :class="{ cl4: item.signalLevel === '特别重大', cl5: item.signalLevel === '重大风险', cl6: item.signalLevel === '一般风险'}"
<div class="main-center">{{ item.content }}</div> >{{ item.signalLevel }}</div>
<div class="main-right">{{ item.time }}</div> <div class="main-center">{{ item.signalTitle }}</div>
<div class="main-right">{{ item.signalTime }}</div>
</div> </div>
</div> </div>
<div class="right-mainbtn" @click="handleToMoreRiskSignal"> <div class="right-mainbtn" @click="handleToMoreRiskSignal">
<img src="./assets/btn.png" alt="" /> <img src="./assets/btn.png" alt />
查看更多 查看更多
</div> </div>
</div> </div>
...@@ -75,8 +78,9 @@ ...@@ -75,8 +78,9 @@
</template> </template>
<script setup> <script setup>
import { ref } from "vue"; import { ref, onBeforeMount } from "vue";
import router from "@/router"; import router from "@/router";
import { getLatestUpdates, getRiskSignal } from '@/api/ruleRestriction/index.js'
const list = ref([ const list = ref([
{ {
...@@ -105,11 +109,62 @@ const list = ref([ ...@@ -105,11 +109,62 @@ const list = ref([
} }
]); ]);
// 最新动态列表
const latestUpdateList = ref([{}])
// 当前显示最新动态的序号
const latestUpdateIndex = ref(0)
// 改变序号
const changeIndex = (num) => {
if (num === -1) {
// 判断当前是否是第一个,是的话则将序号设置为最后一个
if (latestUpdateIndex.value === 0) {
latestUpdateIndex.value = latestUpdateList.value.length - 1
} else {
latestUpdateIndex.value--
}
} else {
// 判断当前是否是最后一个,是的话则将序号设置为第一个
if (latestUpdateIndex.value === latestUpdateList.value.length - 1) {
latestUpdateIndex.value = 0
} else {
latestUpdateIndex.value++
}
}
}
const getLatestUpdateInfo = async () => {
try {
const res = await getLatestUpdates();
// console.log('------getLatestUpdateInfo res', res)
if (res && res.code === 200) {
console.log('----getLatestUpdateInfo', res.data)
latestUpdateList.value = res.data
}
} catch (error) {
console.error("获取最新动态接口失败:", error);
}
}
const getRiskSignalInfo = async () => {
try {
const res = await getRiskSignal('0108');
console.log('------getRiskSignalInfo res', res)
if (res && res.code === 200) {
console.log('----getRiskSignalInfo', res.data)
list.value = res.data
}
} catch (error) {
console.error("获取风险信号接口失败:", error);
}
}
// 跳转详情 // 跳转详情
const handleClickToDetail = () => { const handleClickToDetail = () => {
// router.push("/decreeLayout"); // router.push("/decreeLayout");
const route = router.resolve("/ruleRestrictions/detail"); // const route = router.resolve("");
window.open(route.href, "_blank"); window.open(`/ruleRestrictions/detail?id=${latestUpdateList.value[latestUpdateIndex.value].RULEID}`, "_blank");
}; };
// 查看更多风险信号 // 查看更多风险信号
...@@ -117,6 +172,11 @@ const handleToMoreRiskSignal = () => { ...@@ -117,6 +172,11 @@ const handleToMoreRiskSignal = () => {
const route = router.resolve("/riskSignal"); const route = router.resolve("/riskSignal");
window.open(route.href, "_blank"); window.open(route.href, "_blank");
}; };
onBeforeMount(async () => {
await getLatestUpdateInfo()
await getRiskSignalInfo()
})
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
...@@ -363,7 +423,7 @@ const handleToMoreRiskSignal = () => { ...@@ -363,7 +423,7 @@ const handleToMoreRiskSignal = () => {
.right-main { .right-main {
width: 468px; width: 468px;
padding-right: 5px; padding-right: 5px;
height: 47px; // height: 47px;
border-radius: 2px; border-radius: 2px;
display: flex; display: flex;
align-items: center; align-items: center;
...@@ -373,7 +433,7 @@ const handleToMoreRiskSignal = () => { ...@@ -373,7 +433,7 @@ const handleToMoreRiskSignal = () => {
} }
.main-left { .main-left {
width: 40px; width: 40px;
height: 40px; // height: 40px;
margin: 4px 13px 3px 2px; margin: 4px 13px 3px 2px;
border-radius: 50%; border-radius: 50%;
font-size: 12px; font-size: 12px;
...@@ -391,9 +451,13 @@ const handleToMoreRiskSignal = () => { ...@@ -391,9 +451,13 @@ const handleToMoreRiskSignal = () => {
background-color: rgba(255, 247, 230, 1); background-color: rgba(255, 247, 230, 1);
color: rgba(250, 140, 22, 1); color: rgba(250, 140, 22, 1);
} }
.cl6 {
background-color: rgba(255, 247, 230, 1);
color: rgb(22, 223, 250);
}
.main-center { .main-center {
width: 347px; width: 347px;
height: 30px; // height: 30px;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
font-family: "Microsoft YaHei"; font-family: "Microsoft YaHei";
...@@ -403,7 +467,7 @@ const handleToMoreRiskSignal = () => { ...@@ -403,7 +467,7 @@ const handleToMoreRiskSignal = () => {
} }
.main-right { .main-right {
width: 60px; width: 60px;
height: 24px; // height: 24px;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
font-family: "Microsoft YaHei"; font-family: "Microsoft YaHei";
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<input v-model="input" class="search-input" placeholder="搜索规则限制" /> <input v-model="input" class="search-input" placeholder="搜索规则限制" />
<div class="search-btn-small" @click="handleSearch"> <div class="search-btn-small" @click="handleSearch">
<div class="search-icon"> <div class="search-icon">
<img src="./assets/icons/search-icon.png" alt="" /> <img src="./assets/icons/search-icon.png" alt />
</div> </div>
<div class="search-text">搜索</div> <div class="search-text">搜索</div>
</div> </div>
...@@ -15,25 +15,25 @@ ...@@ -15,25 +15,25 @@
<div class="btn" @click="handleToPosi('position1')"> <div class="btn" @click="handleToPosi('position1')">
<div class="btn-text">最新动态</div> <div class="btn-text">最新动态</div>
<div class="btn-icon"> <div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" /> <img src="@/assets/icons/arrow-right-icon.png" alt />
</div> </div>
</div> </div>
<div class="btn" @click="handleToPosi('position2')"> <div class="btn" @click="handleToPosi('position2')">
<div class="btn-text">咨询要闻</div> <div class="btn-text">咨询要闻</div>
<div class="btn-icon"> <div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" /> <img src="@/assets/icons/arrow-right-icon.png" alt />
</div> </div>
</div> </div>
<div class="btn" @click="handleToPosi('position3')"> <div class="btn" @click="handleToPosi('position3')">
<div class="btn-text">数据总览</div> <div class="btn-text">数据总览</div>
<div class="btn-icon"> <div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" /> <img src="@/assets/icons/arrow-right-icon.png" alt />
</div> </div>
</div> </div>
<div class="btn" @click="handleToPosi('position4')"> <div class="btn" @click="handleToPosi('position4')">
<div class="btn-text">资源库</div> <div class="btn-text">资源库</div>
<div class="btn-icon"> <div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" /> <img src="@/assets/icons/arrow-right-icon.png" alt />
</div> </div>
</div> </div>
</div> </div>
...@@ -55,51 +55,51 @@ ...@@ -55,51 +55,51 @@
<div class="search-main"> <div class="search-main">
<input v-model="input" placeholder="搜索规则限制" class="search-input" /> <input v-model="input" placeholder="搜索规则限制" class="search-input" />
<div class="search-btn"> <div class="search-btn">
<img src="./assets/icons/search-icon.png" alt="" /> <img src="./assets/icons/search-icon.png" alt />
搜索 搜索
</div> </div>
</div> </div>
<!-- <div class="search-center"> <div class="search-center">
<div class="search-item"> <div class="search-item">
<div class="search-item-num">190</div> <div class="search-item-num">{{ statCountInfo.AOCOUNT }}</div>
<div class="search-item-name">规则限制政令</div> <div class="search-item-name">规则限制政令</div>
</div> </div>
<div class="search-item"> <div class="search-item">
<div class="search-item-num">125</div> <div class="search-item-num">{{ statCountInfo.ENTITYCOUNT }}</div>
<div class="search-item-name">规则限制实体</div> <div class="search-item-name">规则限制实体</div>
</div> </div>
<div class="search-item"> <div class="search-item">
<div class="search-item-num">18</div> <div class="search-item-num">{{ statCountInfo.ACTACOUNT }}</div>
<div class="search-item-name">排华科技联盟</div> <div class="search-item-name">排华科技联盟</div>
</div> </div>
<div class="search-item"> <div class="search-item">
<div class="search-item-num">12</div> <div class="search-item-num">{{ statCountInfo.COUNTRYCOUNT }}</div>
<div class="search-item-name">排华国家数量</div> <div class="search-item-name">排华国家数量</div>
</div> </div>
</div> --> </div>
<div class="search-bottom"> <div class="search-bottom">
<div class="btn" @click="handleToPosi('position1')"> <div class="btn" @click="handleToPosi('position1')">
<div class="btn-text">最新动态</div> <div class="btn-text">最新动态</div>
<div class="btn-icon"> <div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" /> <img src="@/assets/icons/arrow-right-icon.png" alt />
</div> </div>
</div> </div>
<div class="btn" @click="handleToPosi('position2')"> <div class="btn" @click="handleToPosi('position2')">
<div class="btn-text">咨询要闻</div> <div class="btn-text">咨询要闻</div>
<div class="btn-icon"> <div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" /> <img src="@/assets/icons/arrow-right-icon.png" alt />
</div> </div>
</div> </div>
<div class="btn" @click="handleToPosi('position3')"> <div class="btn" @click="handleToPosi('position3')">
<div class="btn-text">数据总览</div> <div class="btn-text">数据总览</div>
<div class="btn-icon"> <div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" /> <img src="@/assets/icons/arrow-right-icon.png" alt />
</div> </div>
</div> </div>
<div class="btn" @click="handleToPosi('position4')"> <div class="btn" @click="handleToPosi('position4')">
<div class="btn-text">资源库</div> <div class="btn-text">资源库</div>
<div class="btn-icon"> <div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" /> <img src="@/assets/icons/arrow-right-icon.png" alt />
</div> </div>
</div> </div>
</div> </div>
...@@ -137,7 +137,7 @@ ...@@ -137,7 +137,7 @@
</template> </template>
<script setup> <script setup>
import { ref, nextTick } from "vue"; import { ref, nextTick, onMounted } from "vue";
import { useRouter } from "vue-router"; import { useRouter } from "vue-router";
import comTitle from "./common/comTitle.vue"; import comTitle from "./common/comTitle.vue";
import newData from "./components/dataNew/index.vue"; import newData from "./components/dataNew/index.vue";
...@@ -147,6 +147,7 @@ import resLib from "./components/resLib/index.vue"; ...@@ -147,6 +147,7 @@ import resLib from "./components/resLib/index.vue";
import HeaderMenu from "@/components/headerMenu.vue"; import HeaderMenu from "@/components/headerMenu.vue";
import headerInfo from "@/components/headerInfo.vue"; import headerInfo from "@/components/headerInfo.vue";
import { useContainerScroll } from "@/hooks/useScrollShow"; import { useContainerScroll } from "@/hooks/useScrollShow";
import { getStatCount } from '@/api/ruleRestriction/index.js'
// 搜索框 // 搜索框
const input = ref(""); const input = ref("");
...@@ -155,6 +156,20 @@ const { isShow } = useContainerScroll(homeMainRef); ...@@ -155,6 +156,20 @@ const { isShow } = useContainerScroll(homeMainRef);
const router = useRouter(); const router = useRouter();
const statCountInfo = ref({})
const getStatCountInfo = async () => {
try {
const res = await getStatCount();
if (res && res.code === 200) {
// console.log('----getStatCountInfo', res.data)
statCountInfo.value = res.data
}
} catch (error) {
console.error("获取首页统计接口失败:", error);
}
}
// 搜索功能 // 搜索功能
const handleSearch = () => { const handleSearch = () => {
console.log("搜索内容:", input.value); console.log("搜索内容:", input.value);
...@@ -190,6 +205,10 @@ const handleBackHome = () => { ...@@ -190,6 +205,10 @@ const handleBackHome = () => {
path: "/overview" path: "/overview"
}); });
}; };
onMounted(async () => {
await getStatCountInfo()
})
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
...@@ -226,6 +245,45 @@ const handleBackHome = () => { ...@@ -226,6 +245,45 @@ const handleBackHome = () => {
width: 960px; width: 960px;
height: 168px; height: 168px;
margin: 0 auto 68px auto; margin: 0 auto 68px auto;
.search-center {
width: 688px;
height: 48px;
margin: 0 auto;
margin-top: 36px;
display: flex;
justify-content: space-between;
.search-item {
width: 120px;
height: 57px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
.search-item-num {
font-family: Microsoft YaHei;
font-style: Bold;
font-size: 36px;
font-weight: 700;
line-height: 22px;
letter-spacing: 0px;
text-align: center;
color: rgba(5, 95, 194, 1);
}
.search-item-name {
font-family: Microsoft YaHei;
font-style: Regular;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: center;
color: rgba(95, 101, 108, 1);
}
}
}
.search-main { .search-main {
display: flex; display: flex;
padding-right: 3px; padding-right: 3px;
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论