提交 89cf2235 authored 作者: 朱政's avatar 朱政

feat:所有智库概览页的风险信号的dialog的样式出一个组件,风险信号管理的dialog的样式开发

上级 4e9a1efd
流水线 #417 已通过 于阶段
in 1 分 35 秒
<template>
<el-dialog
v-model="visible"
class="risk-signal-detail-dialog"
modal-class="risk-signal-detail-modal"
width="1280px"
align-center
:z-index="zIndex"
:show-close="true"
destroy-on-close
@closed="handleClosed"
>
<template #header>
<img class="header-icon" src="@/views/viewRiskSignal/assets/images/risk-icon.png" alt="" />
<span class="risk-signal-detail-dialog__level risk-signal-detail-dialog__level--lv1">特别重大风险</span>
</template>
<div class="risk-signal-detail-dialog__body">
<span class="risk-signal-detail-dialog__title">扩大实体清单制裁范围,对中企子公司实施同等管制</span>
<div class="risk-signal-detail-dialog__origin">政策法规打压类风险</div>
<div class="risk-signal-detail-dialog__meta">
<span>2025年11月10日 16:14·美国商务部</span>
<div class="risk-signal-detail-dialog__tags">
<AreaTag :key="'overview-risk-dialog-tag-bio'" tagName="生物科技">生物科技</AreaTag>
<AreaTag :key="'overview-risk-dialog-tag-ai'" tagName="人工智能">人工智能</AreaTag>
</div>
</div>
</div>
<div class="risk-signal-detail-dialog_relation">
<div class="relation">
<div class="logo">
<img src="@/views/viewRiskSignal/assets/images/logo.png" alt="" />
</div>
<div class="name-text">总统行政令——</div>
<div class="content-text">关于调整进口木材、锯材及其衍生产品进入美国的相关修正案</div>
</div>
<div class="right-arrow">
<img src="@/views/viewRiskSignal/assets/images/right-arrow.png" alt="" />
</div>
</div>
<div class="risk-signal-detail-dialog__desc">
<p class="risk-signal-detail-dialog__desc-p">
任何被列入美国出口管制“实体清单”或“军事最终用户清单”的企业,如果其直接或间接持有另一家公司50%或以上的股权,那么这家被控股的公司也将自动受到与清单上母公司同等的出口管制限制
</p>
<p class="risk-signal-detail-dialog__desc-p">
任何被列入美国出口管制“实体清单”或“军事最终用户清单”的企业,如果其直接或间接持有另一家公司50%或以上的股权,那么这家被控股的公司也将自动受到与清单上母公司同等的出口管制限制
</p>
</div>
<template #footer>
<el-button type="primary" class="risk-signal-detail-dialog__action-btn" @click="visible = false">
确定风险
</el-button>
</template>
</el-dialog>
</template>
<script setup>
import AreaTag from "@/components/base/AreaTag/index.vue";
defineProps({
/** 与遮罩、弹窗层级一致,避免被大屏/轮播盖住 */
zIndex: {
type: Number,
default: 20000
}
});
const emit = defineEmits(["closed"]);
const visible = defineModel({ type: Boolean, default: false });
function handleClosed() {
emit("closed");
}
</script>
<style lang="scss" src="./risk-signal-overview-detail-dialog.scss"></style>
/* 概览页风险信号写死详情弹窗(teleport 到 body,需全局样式;与 viewRiskSignal 管理页 dialog 视觉对齐) */
.risk-signal-detail-modal.el-overlay {
display: flex;
align-items: center;
justify-content: center;
overflow: hidden !important;
z-index: 20000 !important;
}
.risk-signal-detail-modal .el-overlay-dialog {
display: flex;
align-items: center;
justify-content: center;
overflow: hidden !important;
}
.el-dialog.is-align-center.risk-signal-detail-dialog,
.risk-signal-detail-dialog.el-dialog {
position: relative;
width: 1280px !important;
max-width: calc(100vw - 32px);
height: 750px;
max-height: calc(100vh - 32px);
border-radius: 10px;
display: flex;
flex-direction: column;
overflow: hidden !important;
box-sizing: border-box;
padding: 0 12px 12px 12px !important;
}
.risk-signal-detail-dialog.el-dialog::-webkit-scrollbar,
.risk-signal-detail-dialog .el-dialog__body::-webkit-scrollbar {
display: none;
width: 0;
height: 0;
}
.risk-signal-detail-dialog.el-dialog,
.risk-signal-detail-dialog .el-dialog__body {
scrollbar-width: none;
-ms-overflow-style: none;
}
.el-dialog.is-align-center.risk-signal-detail-dialog::after,
.risk-signal-detail-dialog.el-dialog::after {
content: "";
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 88px;
width: calc(1278px + 24px);
max-width: none;
height: 1px;
background-color: rgb(234, 236, 238);
pointer-events: none;
z-index: 5;
}
.risk-signal-detail-dialog .el-dialog__header .risk-signal-detail-dialog__level,
.risk-signal-detail-dialog__level {
font-family: "YouSheBiaoTiHei", sans-serif;
font-weight: 400;
font-size: 30px;
line-height: 39px;
letter-spacing: 0;
text-align: left;
}
.risk-signal-detail-dialog__level--lv1 {
color: rgb(206, 79, 81) !important;
}
.risk-signal-detail-dialog__level--lv2 {
color: rgba(250, 140, 22, 1) !important;
}
.risk-signal-detail-dialog__level--lv3 {
color: rgba(212, 177, 6, 1) !important;
}
.risk-signal-detail-dialog__level--lv4 {
color: rgba(82, 196, 26, 1) !important;
}
.risk-signal-detail-dialog__level--lv5 {
color: rgba(22, 119, 255, 1) !important;
}
.risk-signal-detail-dialog .el-dialog__footer {
padding: 0 !important;
margin: 0 !important;
border-top: none !important;
height: 0;
min-height: 0;
overflow: visible;
position: static;
}
.risk-signal-detail-dialog__action-btn {
position: absolute;
right: 53px;
bottom: 26px;
width: 360px !important;
height: 36px !important;
margin: 0 !important;
padding: 0 !important;
border-radius: 6px !important;
background-color: rgb(5, 95, 194) !important;
border-color: rgb(5, 95, 194) !important;
color: rgb(255, 255, 255) !important;
font-family: "Source Han Sans CN", sans-serif;
font-weight: 400 !important;
font-size: 16px !important;
line-height: 24px !important;
letter-spacing: 0 !important;
text-align: center !important;
z-index: 6;
}
.risk-signal-detail-dialog .el-dialog__header {
flex-shrink: 0;
display: flex;
align-items: center;
margin: 0;
padding: 0;
border-bottom: none;
padding: 8px 0;
position: relative;
}
.risk-signal-detail-dialog .el-dialog__header::after {
content: "";
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 0;
width: calc(1278px + 32px);
max-width: none;
height: 1px;
background-color: rgb(234, 236, 238);
pointer-events: none;
z-index: 1;
}
.risk-signal-detail-dialog .el-dialog__body {
flex: 1;
min-height: 0;
min-width: 0;
overflow: hidden !important;
box-sizing: border-box;
padding-left: 22px;
padding-right: 22px;
padding-top: 34px;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog__title,
.risk-signal-detail-dialog .risk-signal-detail-dialog__desc,
.risk-signal-detail-dialog .risk-signal-detail-dialog__meta,
.risk-signal-detail-dialog .risk-signal-detail-dialog__body {
max-width: 100%;
overflow-wrap: anywhere;
word-break: break-word;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog_relation {
max-width: 100%;
width: 100% !important;
box-sizing: border-box;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog__title {
font-family: "Source Han Sans CN", sans-serif;
font-weight: 700;
font-size: 24px;
line-height: 36px;
letter-spacing: 0;
text-align: justify;
color: rgba(59, 65, 75, 1);
}
.risk-signal-detail-dialog .risk-signal-detail-dialog__origin {
font-family: "Source Han Sans CN", sans-serif;
font-weight: 400;
font-size: 16px;
line-height: 30px;
letter-spacing: 0;
text-align: justify;
color: rgb(206, 79, 81);
background-color: rgb(250, 237, 237);
width: fit-content;
padding: 0 12px;
border-radius: 20px;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog__body {
display: flex;
flex-direction: column;
gap: 8px;
margin-left: 12px;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 12px;
font-family: "Source Han Sans CN", sans-serif;
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: 0;
text-align: left;
color: rgb(59, 65, 75);
justify-content: space-between;
}
.risk-signal-detail-dialog .header-icon {
width: 32px;
height: 32px;
}
.risk-signal-detail-dialog .header-icon img {
width: 100%;
height: 100%;
display: block;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog_relation {
width: 100%;
max-width: 100%;
height: 48px;
box-sizing: border-box;
margin-top: 24px;
background-color: rgb(246, 250, 255);
border: 1px solid rgb(231, 243, 255);
border-radius: 50px;
display: flex;
justify-content: space-between;
cursor: pointer;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog_relation .relation {
height: 36px;
display: flex;
flex-direction: row;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog_relation .logo {
width: 36px;
height: 36px;
margin-top: 6px;
margin-left: 7px;
display: block;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog_relation .logo img {
width: 100%;
height: 100%;
display: block;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog_relation .name-text {
color: rgb(5, 95, 194);
font-family: "Source Han Sans CN", sans-serif;
font-weight: 700;
font-size: 16px;
line-height: 24px;
letter-spacing: 1px;
text-align: left;
margin-top: 12px;
margin-left: 8px;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog_relation .content-text {
color: rgb(5, 95, 194);
font-family: "Source Han Sans CN", sans-serif;
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: 0;
text-align: left;
margin-top: 12px;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog_relation .right-arrow {
width: 12px;
height: 11px;
margin-top: 19px;
margin-right: 18px;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog_relation .right-arrow img {
width: 100%;
height: 100%;
display: block;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog__desc {
color: rgb(95, 101, 108);
font-family: "Source Han Sans CN", sans-serif;
font-weight: 400;
font-size: 16px;
line-height: 30px;
letter-spacing: 0;
text-align: justify;
margin-top: 24px;
padding-left: 12px;
padding-right: 12px;
height: 310px;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog__desc-p {
margin: 0;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog__desc-p + .risk-signal-detail-dialog__desc-p {
margin-top: 12px;
}
.risk-signal-detail-dialog .risk-signal-detail-dialog__tags {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
......@@ -115,6 +115,7 @@
</div>
</div>
</div>
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
</template>
......@@ -123,8 +124,7 @@ import { color } from "echarts";
import { onMounted, ref, computed } from "vue";
import WaveBall from "./WaveBall.vue";
import { getBillRiskSignal } from "@/api/bill/billHome";
import router from "@/router";
import { navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
const sectionTab = [
{
textColor: "rgba(9, 88, 217, 1)",
......@@ -291,8 +291,10 @@ const handleSwithCurNews = name => {
}
};
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalItemToManage = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
const highlightedEventType = ref("");
......
......@@ -125,6 +125,7 @@
</div>
</div>
</div>
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
</template>
......@@ -134,7 +135,8 @@ import { onMounted, ref, onUnmounted, computed } from "vue";
import WaveBall from "./WaveBall.vue";
import { getLatestRiskUpdates, getLatestRisks } from "@/api/zmOverview/risk/index.js";
import router from "@/router/index";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import icon1 from "./icon/title-1.svg";
import icon2 from "./icon/title-2.svg";
import icon3 from "./icon/title-3.svg";
......@@ -652,8 +654,10 @@ const filteredHotNewsList = computed(() => {
return hotNewsList.value.filter(newsItem => newsItem.signalId === currentHoveredSignalId.value);
});
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalRowToManage = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
const handleToRiskManage = () => {
......
......@@ -238,16 +238,18 @@
<DivideHeader id="position4" class="divide4" :titleText="'资源库'"></DivideHeader>
<ResourceLibrarySection :on-click-to-detail="handleClickToDetailO" :on-after-page-change="handlePageChange" />
</div>
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
</div>
</template>
<script setup>
import RiskSignal from "@/components/base/riskSignal/index.vue";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import SummaryCardsPanel from "@/components/base/SummaryCardsPanel/index.vue";
import { onMounted, ref, onUnmounted, nextTick, watch, computed } from "vue";
import router from "@/router/index";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
import setChart from "@/utils/setChart";
import {
getBillIndustry,
......@@ -466,8 +468,10 @@ const handleClickToDetailO = item => {
// router.push("/billLayout?billId=" + item.billId)
};
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalItemToManage = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
// 查看更多风险信号
......
......@@ -113,14 +113,16 @@
<RiskSignal :list="riskSignals" @more-click="handleToMoreRiskSignal" postDate="time" name="content"
riskLevel="title" @item-click="handleRiskSignalItemToManage" />
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
</template>
<script setup>
import RiskSignal from "@/components/base/riskSignal/index.vue";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import { ref, onMounted, computed } from "vue";
import router from "@/router";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
import { getCoopRestrictionTrends, getCoopRestrictionSignals } from "@/api/coopRestriction/coopRestriction.js";
import defaultImg from "./assets/usImg.png";
import CommonPrompt from "../../commonPrompt/index.vue";
......@@ -211,8 +213,10 @@ const handleToRiskDetail = (item) => {
window.open(curRoute.href, "_blank");
};
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalItemToManage = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
// 查看更多风险信号
......
......@@ -403,13 +403,15 @@
</div>
</div>
</div>
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
</template>
<script setup>
import { onMounted, ref, watch, nextTick, reactive, computed } from "vue";
import router from "@/router";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import WordCloudChart from "@/components/base/WordCloundChart/index.vue"
import SimplePagination from "@/components/SimplePagination.vue";
import SummaryCardsPanel from "@/components/base/SummaryCardsPanel/index.vue";
......@@ -491,8 +493,10 @@ const onNavigateTo = () => {
}
// 查看更多风险信号
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalItemToManage = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
const handleToMoreRiskSignal = () => {
......
......@@ -114,7 +114,7 @@
class="box2-main-item"
v-for="(item, index) in warningList"
:key="index"
@click="handleToRiskSignalDetail(item)"
@click="handleToRiskSignalDetail"
>
<div
class="item-left"
......@@ -568,12 +568,14 @@
</div>
</template>
</el-dialog>
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</template>
<script setup>
//这是一个备注
import NewsList from "@/components/base/newsList/index.vue";
import RiskSignal from "@/components/base/riskSignal/index.vue";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import { onMounted, ref, computed, reactive, shallowRef, watch, nextTick } from "vue";
import { useContainerScroll } from "@/hooks/useScrollShow";
const homeMainRef = ref(null);
......@@ -602,7 +604,7 @@ const entityListReleaseFreqChart = useChartInterpretation();
const commerceControlListReleaseFreqChart = useChartInterpretation();
import { useRouter } from "vue-router";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
const router = useRouter();
......@@ -674,9 +676,11 @@ const handleToPosi = id => {
}
};
// 风险信号:进入管理页并自动打开列表第一条详情
const isRiskOverviewDetailOpen = ref(false);
// 风险信号:概览写死详情弹窗
const handleToRiskSignalDetail = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
const sanctionList = ref([]);
......
......@@ -544,12 +544,14 @@
</custom-container>
</el-col>
</el-row>
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
</div>
</template>
<script setup>
import RiskSignal from "@/components/base/riskSignal/index.vue";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import { onMounted, ref, computed } from "vue";
import scrollToTop from "@/utils/scrollToTop";
import setChart from "@/utils/setChart";
......@@ -632,6 +634,12 @@ const messageList = ref([
content: "提出特朗普政府的AI政策强调技术开放与快速应用,但可能以牺牲安全防范为代价,开启了“潘多拉魔盒”。"
}
]);
const isRiskOverviewDetailOpen = ref(false);
const handleToRiskSignalDetail = () => {
isRiskOverviewDetailOpen.value = true;
};
// 查看更多风险信号
const handleToMoreRiskSignal = () => {
const route = router.resolve("/viewRiskSignal");
......
......@@ -660,12 +660,14 @@
</div>
</template>
</el-dialog>
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</template>
<script setup>
//这是一个备注
import NewsList from "@/components/base/newsList/index.vue";
import RiskSignal from "@/components/base/riskSignal/index.vue";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import { onMounted, ref, computed, reactive, shallowRef, watch, nextTick } from "vue";
import { useContainerScroll } from "@/hooks/useScrollShow";
const homeMainRef = ref(null);
......@@ -693,7 +695,7 @@ const entityListReleaseFreqChart = useChartInterpretation();
const commerceControlListReleaseFreqChart = useChartInterpretation();
import { useRouter } from "vue-router";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
const router = useRouter();
......@@ -776,9 +778,11 @@ const handleToPosi = id => {
}
};
// 风险信号:进入管理页并自动打开列表第一条详情
const isRiskOverviewDetailOpen = ref(false);
// 风险信号:概览写死详情弹窗
const handleToRiskSignalDetail = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
const sanctionList = ref([]);
......
......@@ -114,13 +114,15 @@
<AdvantagesAnalysis />
<div style="width: 100%;height: 100px;"></div>
</div>
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
</template>
<script setup>
import { ref } from 'vue';
import router from '@/router';
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from '@/utils/riskSignalOverviewNavigate';
import { navigateToViewRiskSignal } from '@/utils/riskSignalOverviewNavigate';
import RiskSignalOverviewDetailDialog from '@/components/base/RiskSignalOverviewDetailDialog/index.vue';
import MeansAnalysis from './component/MeansAnalysis.vue';
import ResourceAnalysis from './component/ResourceAnalysis.vue'
import AdvantagesAnalysis from './component/AdvantagesAnalysis.vue'
......@@ -221,8 +223,10 @@ const warningList = ref([
{ title: '首次提出“限制外国敏感实体获取补偿', time: '一天前', status: 0 },
]);
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalItemClick = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
// 查看更多风险信号
......
......@@ -147,6 +147,7 @@
</div> -->
<RiskSignal :list="warningList" @more-click="handleToMoreRiskSignal" @item-click="handleRiskSignalItemToManage"
riskLevel="signalLevel" postDate="signalTime" name="signalTitle" />
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
<DivideHeader id="position2" class="divide2" :titleText="'资讯要闻'"></DivideHeader>
<div class="center-center">
......@@ -345,11 +346,12 @@
<script setup>
import RiskSignal from "@/components/base/riskSignal/index.vue";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import NewsList from "@/components/base/newsList/index.vue";
import { onMounted, ref, computed } from "vue";
import * as echarts from "echarts";
import router from "@/router";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
import DivideHeader from "@/components/DivideHeader.vue";
import { useContainerScroll } from "@/hooks/useScrollShow";
import getPieChart from "./utils/piechart";
......@@ -515,8 +517,10 @@ const handleClickToDetail = university => {
// window.open(route.href, "_blank");
};
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalItemToManage = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
// 查看更多风险信号
......
......@@ -59,6 +59,7 @@
</overviewMainBox>
</div>
<RiskSignal :list="box2Data" @more-click="handleToMoreRiskSignal" @item-click="handleRiskSignalItemToManage" postDate="signalTime" name="signalTitle" riskLevel="signalLevel" />
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
<DivideHeader id="position2" class="divide-header" :titleText="'资讯要闻'"></DivideHeader>
......@@ -266,6 +267,7 @@ import { onMounted, ref, nextTick, reactive } from "vue";
import LeftBtn from "@/components/base/pageBtn/LeftBtn.vue";
import RightBtn from "@/components/base/pageBtn/RightBtn.vue";
import RiskSignal from "@/components/base/riskSignal/index.vue";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import TipTab from "@/components/base/TipTab/index.vue"
import MessageBubble from "@/components/base/messageBubble/index.vue"
import NewsList from "@/components/base/newsList/index.vue";
......@@ -278,7 +280,7 @@ import CarouselItem232 from '@/views/marketAccessRestrictions/marketAccessHome/c
import setChart from "@/utils/setChart";
import router from "@/router";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
import getMultiLineChart from "./utils/multiLineChart";
import getPieChart from "./utils/piechart";
......@@ -929,8 +931,10 @@ const handleFetchSurveyList = async () => {
} catch (error) { }
};
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalItemToManage = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
// 查看更多风险信号
......
......@@ -195,6 +195,7 @@
<strengthComparison />
</div>
</div>
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
</template>
......@@ -204,7 +205,8 @@ import Thematicanalysis from "./component/Thematicanalysis.vue";
import ResourceSupport from "./component/ResourceSupport.vue";
import strengthComparison from "./component/strengthComparison.vue";
import router from "@/router";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
const searchText = ref("");
const handleSearch = () => {
......@@ -224,8 +226,10 @@ const handleToSearch = () => {
window.open(route.href, "_blank");
};
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalItemClick = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
// 查看更多风险信号
......
......@@ -71,14 +71,16 @@
</div> -->
<RiskSignal :list="list" @more-click="handleToMoreRiskSignal" @item-click="handleRiskSignalItemToManage"
riskLevel="signalLevel" postDate="signalTime" name="signalTitle" />
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
</template>
<script setup>
import RiskSignal from "@/components/base/riskSignal/index.vue";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import { ref, onBeforeMount, computed } from "vue";
import router from "@/router";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
import { getLatestUpdates, getRiskSignal } from '@/api/ruleRestriction/index.js'
const list = ref([
......@@ -195,8 +197,10 @@ const handleToRiskDetail = (item) => {
// window.open(curRoute.href, "_blank");
// };
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalItemToManage = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
// 查看更多动态
......
......@@ -92,17 +92,19 @@
</div> -->
<RiskSignal :list="list" @more-click="handleToMoreRiskSignal" @item-click="handleRiskSignalItemToManage"
postDate="signalTime" name="signalTitle" riskLevel="signalLevel" />
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
</template>
<script setup>
import RiskSignal from "@/components/base/riskSignal/index.vue";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import { ref, onMounted } from "vue";
import {
getNewProject, getRiskSignal
} from "@/api/scientificFunding/overview";
import router from "@/router";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
const list = ref([
......@@ -125,8 +127,10 @@ const formatDate = (dateStr) => {
const [y, m, d] = dateStr.split('-');
return `${y}${m}${d}日`;
};
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalItemToManage = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
// 查看更多风险信号
......
......@@ -154,6 +154,7 @@
<RiskSignal :list="warningList" @more-click="handleToMoreRiskSignal" @item-click="handleRiskSignalItemToManage"
postDate="signalTime" name="signalTitle" riskLevel="signalLevel" />
<RiskSignalOverviewDetailDialog v-model="isRiskOverviewDetailOpen" />
</div>
<DivideHeader id="position2" class="divide-header" :titleText="'言论动态'"></DivideHeader>
<div class="center-center">
......@@ -318,6 +319,7 @@
<script setup>
import RiskSignal from "@/components/base/riskSignal/index.vue";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import { onMounted, ref } from "vue";
import { useRouter } from "vue-router";
import scrollToTop from "@/utils/scrollToTop";
......@@ -346,7 +348,7 @@ import SpeechStance from "./component/speechStance.vue";
import PersonTable from "./component/PersonTable.vue";
import SourceLibrary from "./component/SourceLibrary.vue";
import { useContainerScroll } from "@/hooks/useScrollShow";
import { navigateToViewRiskSignal, navigateToViewRiskSignalOpenFirstDetail } from "@/utils/riskSignalOverviewNavigate";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
const router = useRouter();
......@@ -802,8 +804,10 @@ const handleClickCate = cate => {
typeId.value = cate.typeId;
};
const isRiskOverviewDetailOpen = ref(false);
const handleRiskSignalItemToManage = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
// 查看更多风险信号
......
......@@ -211,27 +211,7 @@
<RiskSignal :list="warningList" @more-click="handleToMoreRiskSignal" postDate="time" name="title"
@item-click="handleRiskSignalItemToManage" />
<el-dialog v-model="isRiskDetailVisible" class="risk-signal-detail-dialog"
modal-class="risk-signal-detail-modal" width="1280px" align-center :z-index="20000" :show-close="true"
destroy-on-close
@closed="handleCloseRiskDetail">
<template #header>
<span class="risk-signal-detail-dialog__title">{{ riskDetailItem.title }}</span>
</template>
<div v-if="riskDetailItem.title" class="risk-signal-detail-dialog__body">
<div class="risk-signal-detail-dialog__meta">
<span>{{ riskDetailItem.origin }}</span>
<span>{{ riskDetailItem.time }}</span>
<span class="risk-signal-detail-dialog__level">{{ riskDetailItem.risktype }}</span>
</div>
<div class="risk-signal-detail-dialog__desc">{{ riskDetailItem.dsc }}</div>
<div v-if="riskDetailItem.tag.length" class="risk-signal-detail-dialog__tags">
<AreaTag v-for="(tag, index) in riskDetailItem.tag" :key="'risk-detail-tag-' + index + '-' + tag"
:tagName="tag">
{{ tag }}</AreaTag>
</div>
</div>
</el-dialog>
<RiskSignalOverviewDetailDialog v-model="isRiskDetailVisible" />
</div>
<DivideHeader id="position2" class="divide-header" :titleText="'资讯要闻'"></DivideHeader>
<div class="center-center">
......@@ -459,9 +439,10 @@
<script setup>
import RiskSignal from "@/components/base/riskSignal/index.vue";
import RiskSignalOverviewDetailDialog from "@/components/base/RiskSignalOverviewDetailDialog/index.vue";
import NewsList from "@/components/base/newsList/index.vue";
import MessageBubble from "@/components/base/messageBubble/index.vue"
import { onBeforeUnmount, onMounted, ref, computed, reactive, nextTick } from "vue";
import { onBeforeUnmount, onMounted, ref, computed, nextTick } from "vue";
import scrollToTop from "@/utils/scrollToTop";
import router from "@/router";
import { navigateToViewRiskSignal } from "@/utils/riskSignalOverviewNavigate";
......@@ -535,51 +516,6 @@ import { useGotoNewsDetail } from '@/router/modules/news';
const gotoNewsDetail = useGotoNewsDetail()
const containerRef = ref(null);
const isRiskDetailVisible = ref(false);
const riskDetailItem = reactive({
title: "",
origin: "",
time: "",
risktype: "",
dsc: "",
tag: []
});
const HARD_CODED_RISK_DETAIL_MAP = {
"关于对中华人民共和国合成阿片类药物供应链...": {
origin: "智库概览 · 风险信号",
time: "一天前",
risktype: "特别重大",
dsc:
"这里先写死详情内容:该风险信号涉及合成阿片类药物供应链相关议题,可能对相关实体合规、供应链与对外合作产生影响。后续接入后端后将替换为真实详情。",
tag: ["生物科技", "供应链", "合规风险"]
},
"关于调整钢铁进口的公告": {
origin: "智库概览 · 风险信号",
time: "一天前",
risktype: "重大风险",
dsc:
"这里先写死详情内容:钢铁进口政策调整可能影响相关行业成本结构与贸易路径,需关注后续执行细则与范围变化。",
tag: ["材料", "贸易政策", "成本影响"]
},
"关于修订对中华人民共和国低价值进口商品适...": {
origin: "智库概览 · 风险信号",
time: "一天前",
risktype: "一般风险",
dsc:
"这里先写死详情内容:低价值进口商品规则修订可能带来申报、税费与物流环节的流程变化,建议提前梳理影响链路。",
tag: ["跨境电商", "关务", "流程变化"]
}
};
const handleCloseRiskDetail = () => {
isRiskDetailVisible.value = false;
riskDetailItem.title = "";
riskDetailItem.origin = "";
riskDetailItem.time = "";
riskDetailItem.risktype = "";
riskDetailItem.dsc = "";
riskDetailItem.tag = [];
};
const statCountInfo = ref([]);
const pageSize = ref(15)
const totalAllItem = ref(0)
......@@ -874,7 +810,7 @@ const handleGetThinkTankRiskSignal = async () => {
title: item.name,
time: item.times,
id: item.reportId,
status: item.riskLevel || "暂无数"
status: item.riskLevel || "暂无数"
};
});
}
......@@ -2188,23 +2124,8 @@ const handleClick = tank => {
// router.push({ name: "ThinkTankDetail", params: { id: tank.id, name: tank.name } })
};
// 风险信号 item:当前页弹窗(先写死内容,后续接后端)
const handleRiskSignalItemToManage = (item) => {
const title = item?.title || "";
const time = item?.time || "";
const risktype = item?.status || "";
const hardCoded = HARD_CODED_RISK_DETAIL_MAP[title] || {};
riskDetailItem.title = title;
riskDetailItem.origin = hardCoded.origin || "智库概览 · 风险信号";
riskDetailItem.time = hardCoded.time || time || "—";
riskDetailItem.risktype = hardCoded.risktype || risktype || "一般风险";
riskDetailItem.dsc =
hardCoded.dsc ||
"这里先写死详情内容:后续接入后端后将替换为真实详情。";
riskDetailItem.tag = hardCoded.tag || ["暂无标签"];
// 风险信号 item:当前页弹窗(内容与样式与风险信号管理页 dialog 一致,写死展示)
const handleRiskSignalItemToManage = () => {
isRiskDetailVisible.value = true;
};
......@@ -4678,89 +4599,7 @@ onBeforeUnmount(() => {
</style>
<style lang="scss">
/* el-dialog 默认 teleport 到 body,壳子样式需非 scoped */
/* 遮罩层内水平垂直居中(勿对 .el-dialog 写 margin:0 !important,会顶到左上角) */
.risk-signal-detail-modal.el-overlay {
display: flex;
align-items: center;
justify-content: center;
z-index: 20000 !important;
}
.risk-signal-detail-modal .el-overlay-dialog {
display: flex;
align-items: center;
justify-content: center;
}
.risk-signal-detail-dialog.el-dialog {
width: 1280px !important;
max-width: calc(100vw - 32px);
height: 750px;
max-height: calc(100vh - 32px);
border-radius: 10px;
display: flex;
flex-direction: column;
overflow: hidden;
box-sizing: border-box;
}
.risk-signal-detail-dialog .el-dialog__header {
flex-shrink: 0;
padding: 16px 20px 8px;
margin: 0;
}
.risk-signal-detail-dialog .el-dialog__body {
flex: 1;
min-height: 0;
overflow: auto;
padding: 12px 20px 20px;
box-sizing: border-box;
}
.risk-signal-detail-dialog__title {
font-size: 18px;
font-weight: 700;
line-height: 24px;
color: rgba(59, 65, 75, 1);
}
.risk-signal-detail-dialog__body {
display: flex;
flex-direction: column;
gap: 12px;
}
.risk-signal-detail-dialog__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 12px;
font-size: 14px;
line-height: 22px;
color: rgba(95, 101, 108, 1);
}
.risk-signal-detail-dialog__level {
color: rgba(5, 95, 194, 1);
}
.risk-signal-detail-dialog__desc {
font-size: 16px;
line-height: 24px;
color: rgba(59, 65, 75, 1);
text-align: justify;
}
.risk-signal-detail-dialog__tags {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
/* 弹窗打开时,禁用轮播左右切换按钮,避免穿透点击 */
/* 弹窗打开时禁用轮播箭头穿透(样式仅作用于智库页结构) */
.home-main.is-risk-detail-open {
.box1-left,
.box1-right {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论