提交 9a39c7fc authored 作者: 付康's avatar 付康

合并分支 'zz-dev' 到 'pre'

feat:所有智库概览页的风险信号的dialog的样式出一个组件,风险信号管理的dialog的样式开发 查看合并请求 !333
流水线 #419 已通过 于阶段
in 5 分 0 秒
<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 = () => {
......
......@@ -146,7 +146,7 @@
class="box2-main-item"
v-for="(item, index) in warningList"
:key="index"
@click="handleToRiskSignalDetail(item)"
@click="handleToRiskSignalDetail"
>
<div
class="item-left"
......@@ -692,12 +692,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);
......@@ -726,7 +728,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();
......@@ -798,9 +800,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");
......
......@@ -3,25 +3,12 @@
<div class="home-main" ref="homeMainRef">
<div class="home-top-bg"></div>
<div class="home-main-header">
<SearchContainer
style="margin-bottom: 0; margin-top: 48px; height: fit-content"
v-if="homeMainRef"
placeholder="搜索投融资限制"
:containerRef="homeMainRef"
areaName="实体清单"
/>
<SearchContainer style="margin-bottom: 0; margin-top: 48px; height: fit-content" v-if="homeMainRef"
placeholder="搜索投融资限制" :containerRef="homeMainRef" areaName="实体清单" />
<div class="home-main-header-footer-info">
<InfoCard
v-for="(item, index) in infoList"
:key="item.id"
:title="item.nameZh"
:subtitle="item.nameAbbr"
:description="item.description"
:quantity="item.postCount"
:unit="item.unit"
:color="infoListColor[index]"
@click="handleToEntityListNoId(item)"
/>
<InfoCard v-for="(item, index) in infoList" :key="item.id" :title="item.nameZh" :subtitle="item.nameAbbr"
:description="item.description" :quantity="item.postCount" :unit="item.unit" :color="infoListColor[index]"
@click="handleToEntityListNoId(item)" />
</div>
</div>
......@@ -47,15 +34,8 @@
<img src="./assets/images/box1-right.png" alt="" />
</div>
</div>
<el-carousel
ref="carouselRef"
height="370px"
:autoplay="false"
:interval="3000"
arrow="never"
indicator-position="none"
@change="handleCarouselChange"
>
<el-carousel ref="carouselRef" height="370px" :autoplay="false" :interval="3000" arrow="never"
indicator-position="none" @change="handleCarouselChange">
<el-carousel-item v-for="(item, index) in entitiesDataInfoList" :key="item.id + index">
<div>
<div class="box1-top">
......@@ -80,29 +60,17 @@
>
<el-tag :type="getTagType(domainItem)">{{ domainItem }}</el-tag>
</div> -->
<AreaTag
v-for="(domainItem, index) in item.domains"
:key="index"
:tagName="domainItem"
/>
<AreaTag v-for="(domainItem, index) in item.domains" :key="index" :tagName="domainItem" />
</div>
</div>
</div>
<div class="box1-bottom">
<div class="box1-bottom-title">· 涉及主要实体:</div>
<div class="box1-bottom-content">
<div
class="box1-bottom-content-item"
v-for="(ett, index) in item.sanEntities"
:key="index"
@click="handleEntityClick(ett)"
>
<el-image
v-if="ett.img"
class="box1-bottom-content-item-img"
:src="ett.img"
alt=""
></el-image>
<div class="box1-bottom-content-item" v-for="(ett, index) in item.sanEntities" :key="index"
@click="handleEntityClick(ett)">
<el-image v-if="ett.img" class="box1-bottom-content-item-img" :src="ett.img"
alt=""></el-image>
<div v-else class="box1-bottom-content-item-imgUndefined">
{{
(ett.orgName || ett.orgNameZh)?.match(
......@@ -133,14 +101,8 @@
</custom-container>
</el-col>
<el-col :span="8" style="padding-right: 0">
<RiskSignal
:list="warningList"
@item-click="handleToRiskSignalDetail"
@more-click="handleToMoreRiskSignal"
riskLevel="signalLevel"
postDate="signalTime"
name="signalTitle"
/>
<RiskSignal :list="warningList" @item-click="handleToRiskSignalDetail" @more-click="handleToMoreRiskSignal"
riskLevel="signalLevel" postDate="signalTime" name="signalTitle" />
</el-col>
</el-row>
......@@ -163,19 +125,11 @@
</custom-container>
</el-col> -->
<div class="center-center">
<NewsList
:newsList="newsList"
@item-click="handleNewsInfoClick"
@more-click="handleToMoreNews"
content="newsContent"
/>
<MessageBubble
:messageList="socialMediaList"
@person-click="handlePerClick"
imageUrl="avatar"
@more-click="handleToSocialDetail"
/>
<NewsList :newsList="newsList" @item-click="handleNewsInfoClick" @more-click="handleToMoreNews"
content="newsContent" />
<MessageBubble :messageList="socialMediaList" @person-click="handlePerClick" imageUrl="avatar"
@more-click="handleToSocialDetail" />
<!-- <custom-container title="社交媒体" :titleIcon="dialogIcon" height="450px">
<template #default>
<div class="dialog-list">
......@@ -201,19 +155,14 @@
<template #default="scope">
<div style="display: flex; align-items: center">
<span style="margin-right: 10px; width: 40px">{{ scope.row.num }}</span>
<el-progress
:percentage="scope.row.percent * 100"
:show-text="false"
:status="getStatus(scope.row.percent)"
/>
<el-progress :percentage="scope.row.percent * 100" :show-text="false"
:status="getStatus(scope.row.percent)" />
</div>
</template>
</el-table-column>
<el-table-column label="重点领域" width="220" align="center">
<template #default="scope">
<div
style="display: flex; justify-content: center; align-items: center; gap: 5px"
>
<div style="display: flex; justify-content: center; align-items: center; gap: 5px">
<AreaTag v-for="tag in scope.row.tags" :key="tag" :tagName="tag" />
<!-- <el-tag v-for="tag in scope.row.tags" :key="tag" :type="getTagType(tag)">{{
tag
......@@ -235,29 +184,20 @@
</div>
<div class="box3-content">
<div class="box3-content-title">中国军事工业复合体企业清单(CMIC)更新频度</div>
<el-table
:data="commerceControlListReleaseFreq"
stripe
style="width: 100%; margin-bottom: auto"
>
<el-table :data="commerceControlListReleaseFreq" stripe style="width: 100%; margin-bottom: auto">
<el-table-column prop="year" label="年份" width="200" />
<el-table-column label="发布次数" width="300">
<template #default="scope">
<div style="display: flex; align-items: center">
<span style="margin-right: 10px; width: 40px">{{ scope.row.num }}</span>
<el-progress
:percentage="scope.row.percent * 100"
:show-text="false"
:status="getStatus(scope.row.percent)"
/>
<el-progress :percentage="scope.row.percent * 100" :show-text="false"
:status="getStatus(scope.row.percent)" />
</div>
</template>
</el-table-column>
<el-table-column label="重点领域" width="220" align="center">
<template #default="scope">
<div
style="display: flex; justify-content: center; align-items: center; gap: 5px"
>
<div style="display: flex; justify-content: center; align-items: center; gap: 5px">
<el-tag v-for="tag in scope.row.tags" :key="tag" :type="getTagType(tag)">{{
tag
}}</el-tag>
......@@ -286,11 +226,8 @@
<template #default="scope">
<div style="display: flex; align-items: center">
<span style="margin-right: 10px; width: 40px">{{ scope.row.num }}</span>
<el-progress
:percentage="scope.row.percent * 100"
:show-text="false"
:status="getStatus(scope.row.percent)"
/>
<el-progress :percentage="scope.row.percent * 100" :show-text="false"
:status="getStatus(scope.row.percent)" />
</div>
</template>
</el-table-column>
......@@ -362,13 +299,9 @@
<el-row :gutter="16" style="width: 1600px; margin: 0 auto; margin-top: 39px; padding-bottom: 60px">
<CustomTitle id="position4" title="资源库" style="margin-top: 0px" />
<div class="resource-tabs">
<div
v-for="tab in resourceTabs"
:key="tab.value"
class="resource-tab-item"
<div v-for="tab in resourceTabs" :key="tab.value" class="resource-tab-item"
:class="{ active: activeResourceTab == tab.value, disabled: tab.disabled }"
@click="handleResourceTabClick(tab)"
>
@click="handleResourceTabClick(tab)">
{{ tab.label }}
</div>
</div>
......@@ -381,25 +314,15 @@
<div class="box4-item" v-for="(item, idx) in sanctionProcessList" :key="item.title">
<div class="box4-item-left">
<el-image :src="dotIcon" alt="图片" class="box4-item-left-icon" />
<div
class="box4-item-left-line"
v-if="idx + 1 != sanctionProcessList.length"
></div>
<div class="box4-item-left-line" v-if="idx + 1 != sanctionProcessList.length"></div>
</div>
<div class="box4-item-right">
<div class="box4-item-right-header" @click="handleSanc(item)">
<span class="box4-item-right-header-title"
>{{ item.postDate }}{{ item.title }}</span
>
<span class="box4-item-right-header-title">{{ item.postDate }}{{ item.title }}</span>
<span class="box4-item-right-header-desc">{{ item.desc }}</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="box4-item-right-content">
{{ item.content }}
</div>
......@@ -407,12 +330,8 @@
</div>
</div>
</div>
<div
class="box4-footer"
:style="{ marginTop: sanctionProcessList.length > 0 ? '0px' : 'auto' }"
>
<el-button type="primary" link @click="handleGetMore"
>查看更多
<div class="box4-footer" :style="{ marginTop: sanctionProcessList.length > 0 ? '0px' : 'auto' }">
<el-button type="primary" link @click="handleGetMore">查看更多
<el-icon>
<DArrowRight />
</el-icon>
......@@ -429,15 +348,8 @@
</template>
<template #default>
<div class="box5">
<el-table
:data="entitiesList"
class="sanction-table"
stripe
empty-text="暂无数据"
height="700px"
header-row-class-name="table-header"
row-class-name="table-row"
>
<el-table :data="entitiesList" class="sanction-table" stripe empty-text="暂无数据" height="700px"
header-row-class-name="table-header" row-class-name="table-row">
<!-- <el-table-column prop="index" label="序号" width="80" align="center">
<template #default="scope">
{{ scope.$index + 1 + (currentPage - 1) * pageSize }}
......@@ -447,12 +359,8 @@
<el-table-column prop="name" label="实体名称" min-width="200">
<template #default="scope">
<div class="tableName" @click="handleCompClick(scope.row)">
<el-image
v-if="scope.row.img"
class="box1-bottom-content-item-img"
:src="scope.row.img"
alt=""
></el-image>
<el-image v-if="scope.row.img" class="box1-bottom-content-item-img" :src="scope.row.img"
alt=""></el-image>
<div v-else class="box1-bottom-content-item-imgUndefined">
{{
(scope.row.name || scope.row.enName)?.match(
......@@ -506,19 +414,13 @@
<el-table-column prop="revenue" label="50%规则子企业" width="280" align="right">
<template #default="scope">
<div class="num-item" v-if="scope.row.ruleOrgCount > 0">
<div
class="name-item"
:class="[
'revenue-cell',
scope.row.revenue === '无营收数据' ? 'no-revenue' : ''
]"
>
<div class="name-item" :class="[
'revenue-cell',
scope.row.revenue === '无营收数据' ? 'no-revenue' : ''
]">
{{ scope.row.ruleOrgList[0].orgName }}...等
</div>
<div
style="width: 50px; color: #409eff; cursor: pointer"
@click="handleOrgClick(scope.row)"
>
<div style="width: 50px; color: #409eff; cursor: pointer" @click="handleOrgClick(scope.row)">
{{ scope.row.ruleOrgCount }}家>
</div>
</div>
......@@ -530,15 +432,8 @@
<!-- <div class="pagination-info">
第{{ currentPage }}页,共{{ totalPages }}页
</div> -->
<el-pagination
v-model:current-page="currentPage"
:page-size="pageSize"
:total="total"
:pager-count="5"
layout="prev, pager, next"
background
@current-change="handlePageChange"
/>
<el-pagination v-model:current-page="currentPage" :page-size="pageSize" :total="total"
:pager-count="5" layout="prev, pager, next" background @current-change="handlePageChange" />
</div>
</div>
</template>
......@@ -604,14 +499,8 @@
</div>
<div class="right-footer">
<div class="total-count">{{ totalAll }}</div>
<el-pagination
v-model:current-page="currentPageAll"
:page-size="pageSizeAll"
:total="totalAll"
layout="prev, pager, next"
background
@current-change="handlePageChangeAll"
/>
<el-pagination v-model:current-page="currentPageAll" :page-size="pageSizeAll" :total="totalAll"
layout="prev, pager, next" background @current-change="handlePageChangeAll" />
</div>
</div>
</div>
......@@ -646,12 +535,8 @@
</div>
</template>
</el-dialog> -->
<RuleSubsidiaryDialog
v-model="dialogVisible"
:company-name="currentRuleCompany"
:total-count="currentRuleCount"
:data-list="currentOrgList"
/>
<RuleSubsidiaryDialog v-model="dialogVisible" :company-name="currentRuleCompany" :total-count="currentRuleCount"
:data-list="currentOrgList" />
</div>
<el-dialog v-model="mediaVisible" title="社交媒体信息" width="500" :before-close="handleMediaClose">
<div class="dialog-content">
......@@ -664,12 +549,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);
......@@ -697,7 +584,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();
......@@ -780,22 +667,11 @@ const handleToPosi = id => {
}
};
// 跳转到单项制裁页面
// const handleToRiskSignalDetail = item => {
// window.sessionStorage.setItem("curTabName", item.title);
// const routeData = router.resolve({
// path: "/finance/singleSanction",
// query: {
// id: item.sanId,
// sanTypeId: item.sanTypeId
// }
// });
// // 打开新页面
// window.open(routeData.href, "_blank");
// };
const isRiskOverviewDetailOpen = ref(false);
// 风险信号:概览写死详情弹窗
const handleToRiskSignalDetail = () => {
navigateToViewRiskSignalOpenFirstDetail(router);
isRiskOverviewDetailOpen.value = true;
};
// 查看更多风险信号
......@@ -1327,7 +1203,7 @@ const fetchSanctionList = async () => {
});
totalAll.value = res.totalElements;
}
} catch (error) {}
} catch (error) { }
};
const handlePageChangeAll = val => {
......@@ -1620,7 +1496,7 @@ const handleGetHylyList = async () => {
hylymc: "全部分类"
};
categoryList.value = [obj, ...categoryList.value];
} catch (error) {}
} catch (error) { }
};
const chart1Data = ref({
......@@ -2212,6 +2088,7 @@ const handleMediaClick = item => {
}
.box3-content {
// flex: 1;
.el-progress--line {
width: 82px;
......@@ -3606,6 +3483,7 @@ const handleMediaClick = item => {
height: 450px;
display: flex;
gap: 16px;
.center-center-news {
flex-shrink: 0;
}
......@@ -3626,16 +3504,19 @@ const handleMediaClick = item => {
align-items: center;
justify-content: flex-start;
padding: 22px 0;
.data-origin-icon {
width: 16px;
height: 16px;
font-size: 0px;
margin-right: 8px;
img {
width: 100%;
height: 100%;
}
}
.data-origin-text {
font-family: Source Han Sans CN;
font-size: 14px;
......@@ -3648,18 +3529,23 @@ const handleMediaClick = item => {
right: 0px;
bottom: 15px;
z-index: 2;
:deep(.ai-pane-wrapper) {
display: none;
}
:deep(.ai-button-wrapper) {
display: flex;
}
&:hover {
width: 100%;
bottom: 0px;
:deep(.ai-pane-wrapper) {
display: block;
}
:deep(.ai-button-wrapper) {
display: none;
}
......
......@@ -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;
};
......@@ -4667,89 +4588,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 {
......
......@@ -132,9 +132,6 @@
</el-checkbox-group>
</div>
</div>
<div class="select-box">
<div class="header">
<div class="icon"></div>
......@@ -152,9 +149,7 @@
</el-checkbox-group>
</div>
</div>
</div>
<div class="right">
<div class="right-header">
<div class="header-left">
......@@ -188,23 +183,14 @@
</div>
</div>
</div>
<div class="right-main">
<div class="itemlist itemlist--clickable" v-for="(val, idx) in riskList" :key="val.rowKey"
@click="handleOpenRiskDetail(val)">
<div class="box-title">
<div class="risktitle">{{ val.title }}</div>
<div class="risktype" :class="{
risk1: val.risktype === '特别重大风险' || val.risktype === '特别重大风险',
risk2: val.risktype === '重大风险',
risk3: val.risktype === '一般风险'
}">
<div class="icon" :class="{
icon1: val.risktype === '特别重大风险' || val.risktype === '特别重大风险',
icon2: val.risktype === '重大风险',
icon3: val.risktype === '一般风险'
}"></div>
<div class="text">{{ val.risktype }}</div>
<div class="risktype" :class="'risktype--' + getRiskListItemLevelKey(val.risktype)">
<div class="icon" :class="'icon--' + getRiskListItemLevelKey(val.risktype)" />
<div class="text">{{ getRiskListItemLevelLabel(val.risktype) }}</div>
</div>
</div>
<div class="box-source">
......@@ -214,10 +200,7 @@
</div>
<div class="desc-box">{{ val.dsc }}</div>
<div class="tag-box" v-if="val.tag.length">
<AreaTag v-for="(tag, index) in val.tag" :key="index" :tagName="tag">{{ tag }}</AreaTag>
</div>
</div>
</div>
......@@ -234,31 +217,47 @@
</div>
</div>
</div>
<el-dialog v-model="isRiskDetailVisible" class="risk-signal-detail-dialog" modal-class="risk-signal-detail-modal"
width="1280px" align-center :show-close="true" destroy-on-close @closed="handleCloseRiskDetail">
<template #header>
<span class="risk-signal-detail-dialog__title">{{ riskDetailItem.title }}</span>
<img class="header-icon" src="./assets/images/risk-icon.png" alt="" />
<span class="risk-signal-detail-dialog__level" :class="riskDetailLevelModifierClass">{{ riskDetailItem.risktype
}}</span>
</template>
<div v-if="riskDetailItem.title" class="risk-signal-detail-dialog__body">
<span class="risk-signal-detail-dialog__title">{{ riskDetailItem.title }}</span>
<div class="risk-signal-detail-dialog__origin">{{ "政策法规打压类风险" }}</div>
<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>
<span> {{ riskDetailItem.time }}·{{ riskDetailItem.origin }}</span>
<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>
<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 class="risk-signal-detail-dialog_relation">
<div class="relation">
<div class="logo"><img src="./assets/images/logo.png" alt="" /></div>
<div class="name-text">{{ "总统行政令——" }}</div>
<div class="content-text">{{ "关于调整进口木材、锯材及其衍生产品进入美国的相关修正案" }}</div>
</div>
<div class="right-arrow"><img src="./assets/images/right-arrow.png" alt="" /></div>
</div>
<div class="risk-signal-detail-dialog__desc">{{ riskDetailItem.dsc }}</div>
<template #footer>
<el-button type="primary" class="risk-signal-detail-dialog__action-btn" @click="isRiskDetailVisible = false">
确定风险
</el-button>
</template>
</el-dialog>
</div>
</template>
<script setup>
import { nextTick, onMounted, reactive, ref, watch } from "vue";
import { computed, nextTick, onMounted, reactive, ref, watch } from "vue";
import { useRoute, useRouter } from "vue-router";
import { OPEN_FIRST_RISK_DETAIL_QUERY_KEY } from "@/utils/riskSignalOverviewNavigate";
import { getCountInfo, getDailyCount, getPageQuery } from "@/api/riskSignal/index";
......@@ -513,6 +512,39 @@ const handleCloseRiskDetail = () => {
assignRiskDetail({ tag: [] });
};
/** 与通用风险信号组件 `riskSignal` 中 itemLeftStatus1~5 色值一致 */
const getRiskDetailLevelModifier = (level) => {
const t = String(level ?? "").trim();
if (t.includes("特别重大")) return "lv1";
if (t === "重大风险" || (t.includes("重大") && !t.includes("较大") && !t.includes("特别"))) return "lv2";
if (t === "较大风险" || t.includes("较大")) return "lv3";
if (t === "低风险") return "lv5";
if (t === "一般风险" || !t || t === "暂无数据") return "lv4";
return "lv4";
};
const riskDetailLevelModifierClass = computed(
() => `risk-signal-detail-dialog__level--${getRiskDetailLevelModifier(riskDetailItem.risktype)}`
);
/** 列表项风险等级样式键:与 `@/components/base/riskSignal` itemLeftStatus1~5 一致 */
const getRiskListItemLevelKey = (level) => {
const t = String(level ?? "").trim();
if (!t || t === "暂无数值" || t === "暂无数据") return "lv4";
if (t.includes("特别重大")) return "lv1";
if (t === "重大风险" || (t.includes("重大") && !t.includes("较大") && !t.includes("特别"))) return "lv2";
if (t === "较大风险" || t.includes("较大")) return "lv3";
if (t === "低风险") return "lv5";
if (t === "一般风险") return "lv4";
return "lv4";
};
const getRiskListItemLevelLabel = (level) => {
const t = String(level ?? "").trim();
if (!t || t === "暂无数值") return "暂无数据";
return t;
};
const route = useRoute();
const router = useRouter();
......@@ -1086,32 +1118,50 @@ onMounted(async () => {
border-radius: 2px;
}
.icon1 {
background: rgba(206, 79, 81, 1);
.icon--lv1 {
background: rgb(206, 79, 81);
}
.icon--lv2 {
background: rgba(250, 140, 22, 1);
}
.icon2 {
background: rgba(255, 149, 77, 1);
.icon--lv3 {
background: rgba(212, 177, 6, 1);
}
.icon3 {
background: var(--color-main-active);
.icon--lv4 {
background: rgba(82, 196, 26, 1);
}
.icon--lv5 {
background: rgba(22, 119, 255, 1);
}
}
.risktype--lv1 {
background: rgba(255, 241, 240, 1);
color: rgb(206, 79, 81);
}
.risk1 {
background: rgba(206, 79, 81, 0.1);
color: rgba(206, 79, 81, 1);
.risktype--lv2 {
background: rgba(255, 247, 230, 1);
color: rgba(250, 140, 22, 1);
}
.risk2 {
background: rgba(255, 149, 77, 0.1);
color: rgba(255, 149, 77, 1);
.risktype--lv3 {
background: rgba(254, 255, 230, 1);
color: rgba(212, 177, 6, 1);
}
.risk3 {
background: rgba(231, 243, 255, 1);
color: var(--color-main-active);
.risktype--lv4 {
background: rgba(246, 255, 237, 1);
color: rgba(82, 196, 26, 1);
}
.risktype--lv5 {
background: rgba(230, 244, 255, 1);
color: rgba(22, 119, 255, 1);
}
}
......@@ -1187,19 +1237,36 @@ onMounted(async () => {
}
}
/* 复选框尺寸由 .checkbox-group 内统一控制,避免重复覆盖 */
.risk-signal-detail-dialog__title {
font-size: 18px;
font-family: 'Source Han Sans CN';
font-weight: 700;
line-height: 24px;
font-size: 24px;
line-height: 36px;
letter-spacing: 0px;
text-align: justify;
color: rgba(59, 65, 75, 1);
}
.risk-signal-detail-dialog__origin {
font-family: 'Source Han Sans CN', sans-serif;
font-weight: 400;
font-size: 16px;
line-height: 30px;
letter-spacing: 0px;
text-align: justify;
color: rgb(206, 79, 81);
background-color: rgb(250, 237, 237);
width: fit-content;
padding: 0px 12px;
border-radius: 20px;
}
.risk-signal-detail-dialog__body {
display: flex;
flex-direction: column;
gap: 12px;
gap: 8px;
margin-left: 12px;
}
.risk-signal-detail-dialog__meta {
......@@ -1207,20 +1274,112 @@ onMounted(async () => {
flex-wrap: wrap;
align-items: center;
gap: 12px;
font-size: 14px;
line-height: 22px;
color: rgba(95, 101, 108, 1);
font-family: 'Source Han Sans CN';
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: 0px;
text-align: left;
color: rgb(59, 65, 75);
justify-content: space-between;
}
.risk-signal-detail-dialog__level {
color: rgba(5, 95, 194, 1);
.header-icon {
width: 32px;
height: 32px;
img {
width: 100%;
height: 100%;
display: block;
}
}
.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;
.relation {
height: 36px;
display: flex;
flex-direction: row;
.logo {
width: 36px;
height: 36px;
margin-top: 6px;
margin-left: 7px;
display: block;
img {
width: 100%;
height: 100%;
display: block;
}
}
.name-text {
color: rgb(5, 95, 194);
font-family: 'Source Han Sans CN';
font-weight: 700;
font-size: 16px;
line-height: 24px;
letter-spacing: 1px;
text-align: left;
margin-top: 12px;
margin-left: 8px;
}
.content-text {
color: rgb(5, 95, 194);
font-family: 'Source Han Sans CN';
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: 0px;
text-align: left;
margin-top: 12px;
}
}
.right-arrow {
width: 12px;
height: 11px;
margin-top: 19px;
margin-right: 18px;
img {
width: 100%;
height: 100%;
display: block;
}
}
}
.risk-signal-detail-dialog__desc {
color: rgb(95, 101, 108);
font-family: 'Source Han Sans CN';
font-weight: 400;
font-size: 16px;
line-height: 24px;
color: rgba(59, 65, 75, 1);
line-height: 30px;
letter-spacing: 0px;
text-align: justify;
margin-top: 24px;
padding-left: 12px;
padding-right: 12px;
height: 310px;
}
.risk-signal-detail-dialog__tags {
......@@ -1237,15 +1396,20 @@ onMounted(async () => {
display: flex;
align-items: center;
justify-content: center;
overflow: hidden !important;
}
.risk-signal-detail-modal .el-overlay-dialog {
display: flex;
align-items: center;
justify-content: center;
overflow: hidden !important;
}
/* 覆盖 EP 默认 el-dialog 的 padding:12px,仅去掉顶部 */
.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;
......@@ -1253,21 +1417,156 @@ onMounted(async () => {
border-radius: 10px;
display: flex;
flex-direction: column;
overflow: hidden;
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;
}
/* 底部分隔线:原 1278px,左右各再伸出 16px */
.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;
}
/* 详情弹窗标题「风险等级」颜色:与 `@/components/base/riskSignal` 等级色一致 */
.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';
font-weight: 400 !important;
font-size: 16px !important;
line-height: 24px !important;
letter-spacing: 0px !important;
text-align: center !important;
}
.risk-signal-detail-dialog .el-dialog__header {
flex-shrink: 0;
padding: 16px 20px 8px;
display: flex;
align-items: center;
margin: 0;
padding: 0;
border-bottom: none;
padding: 8px 0px;
position: relative;
}
/* 顶部分隔线:替代原 header 底边框,宽度与底部分隔线一致(左右各多 16px) */
.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;
overflow: auto;
padding: 12px 20px 20px;
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;
}
</style>
\ No newline at end of file
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论