Skip to content

R
risk-monitor
提交 87e1f708 authored 作者: hsx's avatar hsx
浏览文件
操作

被制裁时间轴

上级 e3e744b6
隐藏空白字符变更
内嵌 并排
正在显示 包含 544 行增加 和 148 行删除
src/components/base/panes/AiTipPane.vue 0 → 100644
浏览文件 @ 87e1f708
<script setup>
</script>
<template>
<div class="flex-display box">
<div class="img"></div>
<div class="flex-fill txt text-tip-1">
<slot></slot>
</div>
<div class="arrow"><span>→</span></div>
</div>
</template>
<style scoped lang="scss">
@use '@/styles/common.scss';
.box {
background-color: var(--color-primary-2);
flex-direction: row;
gap: 10px;
justify-content: center;
align-items: center;
padding: 6px 12px;
border-radius: 4px;
border: 1px solid var(--color-primary-10);
color: var(--color-primary-100);
}
.img {
width: 19px;
height: 20px;
background-image: url("@/assets/icons/model.png");
}
.txt {
flex: 1;
min-width: 0;
word-wrap: break-word;
word-break: break-word;
overflow-wrap: break-word;
max-width: 100%;
}
.arrow {
border-radius: 50%;
min-width: 24px;
width: 24px;
height: 24px;
background: var(--color-primary-10);
display: flex;
align-items: center;
justify-content: center;
span {
font-size: 22px;
font-weight: bold;
position: relative;
top: -3px;
/* 向上偏移2px */
}
}
</style>
\ No newline at end of file
src/styles/common.scss
浏览文件 @ 87e1f708
...@@ -7,9 +7,14 @@ ...@@ -7,9 +7,14 @@
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1); box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
} }
.flex-display{ .flex-display {
display: flex; display: flex;
} }
.flex-fill {
flex: 1;
}
// 文本超出指定行数省略号显示 // 文本超出指定行数省略号显示
@mixin text-ellipsis($line-clamp) { @mixin text-ellipsis($line-clamp) {
overflow: hidden; overflow: hidden;
...@@ -26,64 +31,67 @@ ...@@ -26,64 +31,67 @@
word-break: break-word; word-break: break-word;
/* 允许单词换行 */ /* 允许单词换行 */
} }
//禁止换行 //禁止换行
.text-nowrap{ .text-nowrap {
white-space: nowrap; white-space: nowrap;
} }
/***文本样式***/ /***文本样式***/
.text-base{ .text-base {
color: var(--color-primary-80); color: var(--color-primary-80);
} }
//0级标题 //0级标题
.text-title-0{ .text-title-0 {
@extend .text-base; @extend .text-base;
color: var(--color-primary-90); color: var(--color-primary-90);
font-size: 32px; font-size: 32px;
} }
.text-title-0-bold{ .text-title-0-bold {
@extend .text-title-0; @extend .text-title-0;
font-weight: Bold; font-weight: Bold;
} }
.text-title-0-show{
.text-title-0-show {
@extend .text-title-0; @extend .text-title-0;
font-size: 48px; font-size: 48px;
font-family: "YouSheBiaoTiHei"; font-family: "YouSheBiaoTiHei";
} }
//1级标题 //1级标题
.text-title-1{ .text-title-1 {
@extend .text-base; @extend .text-base;
color: var(--color-primary-90); color: var(--color-primary-90);
font-size: 24px; font-size: 24px;
} }
.text-title-1-bold{ .text-title-1-bold {
@extend .text-title-1; @extend .text-title-1;
font-weight: Bold; font-weight: Bold;
} }
.text-title-1-show{ .text-title-1-show {
@extend .text-title-1; @extend .text-title-1;
font-size: 30px; font-size: 30px;
font-family: "YouSheBiaoTiHei"; font-family: "YouSheBiaoTiHei";
} }
//2级标题 //2级标题
.text-title-2{ .text-title-2 {
@extend .text-base; @extend .text-base;
color: var(--color-primary-90); color: var(--color-primary-90);
font-size: 20px; font-size: 20px;
line-height:26px; line-height: 26px;
} }
.text-title-2-bold{ .text-title-2-bold {
@extend .text-title-2; @extend .text-title-2;
font-weight: Bold; font-weight: Bold;
} }
.text-title-2-show{ .text-title-2-show {
@extend .text-title-2; @extend .text-title-2;
font-size: 24px; font-size: 24px;
font-family: "YouSheBiaoTiHei"; font-family: "YouSheBiaoTiHei";
...@@ -91,19 +99,19 @@ ...@@ -91,19 +99,19 @@
} }
//3级标题 //3级标题
.text-title-3{ .text-title-3 {
@extend .text-base; @extend .text-base;
color: var(--color-primary-90); color: var(--color-primary-90);
font-size: 18px; font-size: 18px;
line-height:24px; line-height: 24px;
} }
.text-title-3-bold{ .text-title-3-bold {
@extend .text-title-3; @extend .text-title-3;
font-weight: Bold; font-weight: Bold;
} }
.text-title-3-show{ .text-title-3-show {
@extend .text-title-3; @extend .text-title-3;
font-size: 20px; font-size: 20px;
font-family: "YouSheBiaoTiHei"; font-family: "YouSheBiaoTiHei";
...@@ -111,59 +119,61 @@ ...@@ -111,59 +119,61 @@
} }
//正文 //正文
.text-regular{ .text-regular {
@extend .text-base; @extend .text-base;
font-size: 16px; font-size: 16px;
line-height:30px; line-height: 30px;
} }
//正文-加粗 //正文-加粗
.text-bold{ .text-bold {
@extend .text-base; @extend .text-base;
font-weight: Bold; font-weight: Bold;
} }
//正文-紧凑 //正文-紧凑
.text-compact{ .text-compact {
@extend .text-base; @extend .text-base;
font-size: 16px; font-size: 16px;
line-height:24px; line-height: 24px;
} }
.text-compact-bold{ .text-compact-bold {
@extend .text-base; @extend .text-base;
font-size: 16px; font-size: 16px;
line-height:24px; line-height: 24px;
font-weight: Bold; font-weight: Bold;
} }
//1级提示文字 //1级提示文字
.text-tip-1{ .text-tip-1 {
@extend .text-base; @extend .text-base;
color: var(--color-primary-90); color: var(--color-primary-90);
font-size: 16px; font-size: 16px;
line-height:24px; line-height: 24px;
} }
.text-tip-1-bold{ .text-tip-1-bold {
@extend .text-tip-1; @extend .text-tip-1;
font-weight: Bold; font-weight: Bold;
} }
//2级提示文字 //2级提示文字
.text-tip-2{ .text-tip-2 {
@extend .text-base; @extend .text-base;
color: var(--color-primary-90); color: var(--color-primary-90);
font-size: 14px; font-size: 14px;
line-height:22px; line-height: 22px;
} }
.text-tip-2-bold{ .text-tip-2-bold {
@extend .text-tip-2; @extend .text-tip-2;
font-weight: Bold; font-weight: Bold;
} }
//3级提示文字 //3级提示文字
.text-tip-3{ .text-tip-3 {
@extend .text-base; @extend .text-base;
color: var(--color-primary-90); color: var(--color-primary-90);
font-size: 12px; font-size: 12px;
} }
\ No newline at end of file
src/styles/container.scss
浏览文件 @ 87e1f708
@use "common"; @use "common";
/***通用页面***/ /***通用页面***/
.common-page { .common-page {
font-family: "Microsoft Yahei", "PingFang SC", sans-serif;
margin: 16px auto; margin: 16px auto;
width: 1600px; width: 1600px;
align-items: center; align-items: center;
......
src/styles/descriptions.scss
浏览文件 @ 87e1f708
@use "common"; @use "common";
/***没有nav下划线***/ /***通用描述组件***/
.common-descriptions .el-descriptions__label{ .common-descriptions {
@extend .text-tip-1-bold; .el-descriptions__label {
color: var(--text-primary-80-color); @extend .text-tip-1-bold;
} color: var(--text-primary-80-color);
.common-descriptions .el-descriptions__content{ }
@extend .text-tip-1;
color: var(--text-primary-80-color); .common-descriptions .el-descriptions__content {
@extend .text-tip-1;
color: var(--text-primary-80-color);
}
} }
\ No newline at end of file
src/styles/tabs.scss
浏览文件 @ 87e1f708
@use "common"; @use "common";
/***没有nav下划线***/ /***没有nav下划线***/
.tabs-nav-no-wrap .el-tabs__nav-wrap::after{ .tabs-nav-no-wrap {
height: 0px !important; .el-tabs__nav-wrap::after {
width: 0px !important; height: 0px !important;
width: 0px !important;
}
} }
/***nav as card***/ /***nav as card***/
.tabs-header-as-card .el-tabs__header:not(.disinheritance .el-tabs__header) { .tabs-header-as-card {
@extend .background-as-card; .el-tabs__header:not(.disinheritance .el-tabs__header) {
padding: 2px; @extend .background-as-card;
padding: 2px;
}
} }
/***作为按钮样式的tabs-bar***/ /***作为按钮样式的tabs-bar***/
/*选中无下划线*/ /*选中无下划线*/
.tabs-bar-as-btn .el-tabs__active-bar:not(.disinheritance .el-tabs__active-bar) { .tabs-bar-as-btn {
height: 0px; .el-tabs__active-bar:not(.disinheritance .el-tabs__active-bar) {
} height: 0px;
}
/*定义字体*/ /*定义字体*/
.tabs-bar-as-btn .el-tabs__item:not(.disinheritance .el-tabs__item) { .el-tabs__item:not(.disinheritance .el-tabs__item) {
font-size: 20px; font-size: 20px;
font-family: "Source Han Sans CN-Regular"; font-family: "Source Han Sans CN-Regular";
font-weight: Regular; font-weight: Regular;
line-height: 26px; line-height: 26px;
height: 50px; height: 50px;
} }
/*激活时按钮样式*/ /*激活时按钮样式*/
.tabs-bar-as-btn .el-tabs__item.is-active:not(.disinheritance .el-tabs__item){ .el-tabs__item.is-active:not(.disinheritance .el-tabs__item) {
font-size: 24px; font-size: 24px;
font-family: "Source Han Sans CN-Bold"; font-family: "Source Han Sans CN-Bold";
font-weight: Bold; font-weight: Bold;
color: var(--color-primary-100); color: var(--color-primary-100);
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
border-color: var(--color-primary-35); border-color: var(--color-primary-35);
border-radius: 10px; border-radius: 10px;
background-color: var(--color-primary-2); background-color: var(--color-primary-2);
}
} }
/***tabs-bar左边悬浮***/ /***tabs-bar左边悬浮***/
.left-float-nav-tabs .el-tabs__item{ .left-float-nav-tabs {
position:relative;
} // .el-tabs__header {
.left-float-nav-tabs .el-tabs__item.is-active{
background-color: aquamarine; position: relative;
overflow: visible;
transform: translateZ(0);
/* 双重保障 */
/* 创建新的渲染层 */
/* 创建新的层叠上下文 */
.el-tabs__header {
// position: absolute;
left: 0;
top: 0;
z-index: 999;
background-color: red;
// margin-left: -20px;
}
// }
} }
\ No newline at end of file
src/views/companyPages2/component/capitalScale.vue
浏览文件 @ 87e1f708
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<!-- 数值区域 --> <!-- 数值区域 -->
<el-space :size="6"> <el-space :size="6">
<!-- 数值图标 --> <!-- 数值图标 -->
<div class="item-value-img" /> <div class="item-value-img"></div>
<!-- 数值 --> <!-- 数值 -->
<div class="item-value"> <div class="item-value">
{{ t.value }} {{ t.value }}
......
src/views/companyPages2/component/operatingPages/SanctionsSituation.vue 0 → 100644
浏览文件 @ 87e1f708
<script setup>
import { ref, onMounted, onUnmounted } from 'vue';
import { ElSpace, ElRadioGroup, ElRadio, ElRadioButton } from 'element-plus';
import * as echarts from 'echarts';
import { getStudyList, getSanctionList } from '@/api/companyPages';
import AnalysisBox from '@/components/base/boxBackground/analysisBox.vue';
import AiTipPane from '@/components/base/panes/AiTipPane.vue'
// 定义组件属性
const props = defineProps({
enterpriseInfo: {
type: Object,
default: {}
}
});
const studyList = ref([])
const sanctionList = ref([])
const studyTypes = ref([])
const studyType = ref()
const chartDom = ref()
let myChart = null
onMounted(async () => {
await intData()
// await initChart()
})
onUnmounted(() => myChart?.dispose())
async function intData() {
const { data } = await getStudyList(props.enterpriseInfo.id)
studyList.value = data ?? []
data.forEach(t => t.time = new Date(t.year, 1, 1))
studyTypes.value = [...new Set(data.map(t => t.type))]
const { data: sanctionData } = await getSanctionList(props.enterpriseInfo.id)
sanctionList.value = sanctionData ?? []
sanctionList.value.forEach(t => t.time = new Date(t.sanctionDate))
if (studyTypes.value.length > 0) {
studyType.value = studyTypes.value[0]
}
updateCharts(studyType.value, studyList.value, sanctionList.value)
}
// 辅助函数：获取制裁年份对应的Y值
function getSanctionYValue(sanctionDate, filteredList, defaultYValue) {
const year = sanctionDate.getFullYear()
const yearData = filteredList.find(d => d.year === year)
return yearData ? yearData.currentValue : defaultYValue
}
// 辅助函数：格式化文本内容，实现智能换行（考虑中英文混合）
function formatContent(content, maxWidth = 26) {
if (!content) return ''
const lines = []
let currentLine = ''
let currentWidth = 0
// 中文字符宽度设为2，英文字符宽度设为1
for (let i = 0; i < content.length; i++) {
const char = content[i]
const charWidth = /[\u4e00-\u9fa5]/.test(char) ? 2 : 1
if (currentWidth + charWidth <= maxWidth) {
currentLine += char
currentWidth += charWidth
} else {
lines.push(currentLine)
currentLine = char
currentWidth = charWidth
}
}
if (currentLine) {
lines.push(currentLine)
}
return lines.join('\n')
}
function updateCharts(type, dataStudy, dataSanction) {
const filteredList = dataStudy.filter(t => t.type === type)
if (!filteredList.length) return
// 销毁现有图表实例
if (myChart) {
myChart.dispose()
}
myChart = echarts.init(chartDom.value)
// y轴单位
const unit = filteredList[0].unit
const yValue = Math.max(...filteredList.map(d => d.currentValue))
// 计算x轴范围，扩大活动空间
const allDates = [
...filteredList.map(t => t.time),
...dataSanction.map(t => t.time)
]
const minDate = new Date(Math.min(...allDates))
const maxDate = new Date(Math.max(...allDates))
// 向前扩展1年，向后扩展1年
minDate.setFullYear(minDate.getFullYear() - 1)
maxDate.setFullYear(maxDate.getFullYear() + 1)
myChart.setOption({
textStyle: {
fontSize: 14
},
grid: {
left: 60,
right: 110,
},
tooltip: {
trigger: 'axis',
position: function (pt) {
return [pt[0], '10%'];
},
},
dataZoom: [
{
type: 'inside',
start: 0,
end: 100
},
{
start: 0,
end: 100
}
],
xAxis: {
type: 'time',
boundaryGap: false,
min: minDate,
max: maxDate
},
yAxis: {
type: 'value',
boundaryGap: [0, '100%'],
// 显示y轴单位在顶部
name: unit,
nameLocation: 'end'
},
series: [
{
type: 'line',
//从上到下填充颜色
areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: 'rgba(128, 181, 255, 0.8)'
},
{
offset: 1,
color: 'rgba(128, 181, 255, 0)'
}
])
},
data: filteredList.map(t => [t.time, t.currentValue])
},
{
type: 'scatter',
tooltip: { show: false },
data: dataSanction.map(t => {
const currentYValue = getSanctionYValue(t.time, filteredList, yValue) + yValue / 3
return [t.time, currentYValue, t]
}),
markLine: {
lineStyle: {
color: '#ff4d4f',
type: 'dashed',
width: 1
},
data: dataSanction.map(t => {
const currentYValue = getSanctionYValue(t.time, filteredList, yValue) + yValue / 3
return [{
coord: [t.time, 0],
symbol: 'none'
}, {
coord: [t.time, currentYValue],
symbol: 'none',
}]
})
},
coordinateSystem: 'cartesian2d',
symbolSize: 1,
label: {
show: true,
position: 'insideBottomLeft',
formatter: function (params) {
const title = params.data[2].sanctionDate;
const content = params.data[2].content;
const formattedContent = formatContent(content);
return `{title|${title}}\n{content|${formattedContent}}`;
},
rich: {
title: {
fontSize: 16,
lineHeight: 22,
color: '#CE4F51'
},
content: {
fontSize: 15,
fontWeight: 'bold',
width: 200, // 限制宽度
color: '#CE4F51',
lineHeight: 22,
overflow: 'break' // 超出宽度自动换行
}
},
backgroundColor: 'rgba(255, 241, 240, 1)',
borderColor: 'rgba(255, 204, 199, 1)',
borderRadius: 4,
padding: [8, 12],
distance: -1
}
}
],
})
}
function handleStudyTypesChange() {
updateCharts(studyType.value, studyList.value, sanctionList.value)
}
</script>
<template>
<analysis-box title="被制裁时间轴">
<template v-slot:header-btn>
<el-radio-group v-model="studyType" @change="handleStudyTypesChange">
<el-radio-button v-for="item in studyTypes" :key="item" :label="item">{{ item }}</el-radio-button>
</el-radio-group>
</template>
<div class="flex-display content-box">
<div ref="chartDom" class="chart-container"></div>
<ai-tip-pane>123</ai-tip-pane>
</div>
</analysis-box>
</template>
<style lang="scss" scoped>
.content-box {
padding: 10px;
gap: 10px;
flex-direction: column;
}
.chart-container {
height: 500px;
width: 100%;
}
</style>
\ No newline at end of file
src/views/companyPages2/component/operatingPages/index.vue
浏览文件 @ 87e1f708
<script setup lang="ts"> <script setup lang="ts">
import '@/styles/tabs.scss' import '@/styles/tabs.scss'
import { ElTabPane, ElTabs } from 'element-plus'; import { ElTabPane, ElTabs } from 'element-plus';
import SanctionsSituation from './SanctionsSituation.vue';
// 定义组件属性
const props = defineProps({
enterpriseInfo: {
type: Object,
default: {}
}
});
</script> </script>
<template> <template>
<el-tabs tabPosition="left" class="disinheritance tabs-nav-no-wrap left-float-nav-tabs"> <div style="overflow: visible;">
<el-tab-pane label="企业规模"></el-tab-pane> <el-tabs tabPosition="left" class="disinheritance tabs-nav-no-wrap left-float-nav-tabs">
<el-tab-pane label="市值变化"></el-tab-pane> <el-tab-pane label="企业规模">
<el-tab-pane label="研发投入"></el-tab-pane> <sanctions-situation :enterprise-info="enterpriseInfo"></sanctions-situation>
<el-tab-pane label="市场占比"></el-tab-pane> </el-tab-pane>
</el-tabs> <!-- <el-tab-pane label="市值变化"></el-tab-pane>
<el-tab-pane label="研发投入"></el-tab-pane>
<el-tab-pane label="市场占比"></el-tab-pane> -->
</el-tabs>
</div>
</template> </template>
\ No newline at end of file
src/views/companyPages2/index.vue
浏览文件 @ 87e1f708
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
</div> </div>
<el-scrollbar> <el-scrollbar>
<div class="common-page"> <div class="common-page">
<el-space wrap :size="16"> <el-space wrap :size="16" fill>
<title-pane :enterprise-info="enterpriseInfo"></title-pane> <title-pane :enterprise-info="enterpriseInfo"></title-pane>
<el-tabs stretch class="tabs-header-as-card tabs-nav-no-wrap tabs-bar-as-btn"> <el-tabs stretch class="tabs-header-as-card tabs-nav-no-wrap tabs-bar-as-btn">
<el-tab-pane label="企业详情"> <el-tab-pane label="企业详情">
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane lazy label="经营情况"> <el-tab-pane lazy label="经营情况">
<operating-pages /> <operating-pages :enterprise-info="enterpriseInfo" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane lazy label="供应链 / 股权"> <el-tab-pane lazy label="供应链 / 股权">
<div class="flex-display"> <div class="flex-display">
......
src/views/exportControl/index.vue
浏览文件 @ 87e1f708
...@@ -53,9 +53,9 @@ ...@@ -53,9 +53,9 @@
<SearchContainer style="margin-bottom: 0; margin-top: 48px; height: fit-content" v-if="homeMainRef" <SearchContainer style="margin-bottom: 0; margin-top: 48px; height: fit-content" v-if="homeMainRef"
placeholder="搜索出口管制" :containerRef="homeMainRef" areaName="实体清单" /> placeholder="搜索出口管制" :containerRef="homeMainRef" areaName="实体清单" />
<div class="home-main-header-footer-info"> <div class="home-main-header-footer-info">
<InfoCard v-for="(item, index) in infoList" :key="item.id" :title="item.nameZh" :subtitle="item.nameAbbr" <InfoCard v-for="(item, index) in infoList" :key="item.id" :title="item.nameZh"
:description="item.description" :quantity="item.postCount" unit="次" :color="infoListColor[index]" :subtitle="item.nameAbbr" :description="item.description" :quantity="item.postCount" unit="次"
@click="handleToEntityListNoId(item)" /> :color="infoListColor[index]" @click="handleToEntityListNoId(item)" />
</div> </div>
</div> </div>
...@@ -81,9 +81,10 @@ ...@@ -81,9 +81,10 @@
<img src="./assets/images/box1-right.png" alt="" /> <img src="./assets/images/box1-right.png" alt="" />
</div> </div>
</div> </div>
<el-carousel ref="carouselRef" height="370px" :autoplay="true" :interval="3000" arrow="never" <el-carousel ref="carouselRef" height="370px" :autoplay="true" :interval="3000"
indicator-position="none" @change="handleCarouselChange"> arrow="never" indicator-position="none" @change="handleCarouselChange">
<el-carousel-item v-for="(item, index) in entitiesDataInfoList" :key="item.id + index"> <el-carousel-item v-for="(item, index) in entitiesDataInfoList"
:key="item.id + index">
<div> <div>
<div class="box1-top"> <div class="box1-top">
<div class="box1-top-title"> <div class="box1-top-title">
...@@ -92,17 +93,20 @@ ...@@ -92,17 +93,20 @@
<div class="box1-top-content"> <div class="box1-top-content">
<div class="box1-top-content-item"> <div class="box1-top-content-item">
<span class="box1-top-content-item-title">· 发布机构：</span> <span class="box1-top-content-item-title">· 发布机构：</span>
<span class="box1-top-content-item-content">{{ item.postOrgName }}</span> <span class="box1-top-content-item-content">{{ item.postOrgName
}}</span>
</div> </div>
<div class="box1-top-content-item"> <div class="box1-top-content-item">
<span class="box1-top-content-item-title">· 生效日期：</span> <span class="box1-top-content-item-title">· 生效日期：</span>
<span class="box1-top-content-item-content">{{ item.postDate }}</span> <span class="box1-top-content-item-content">{{ item.postDate
}}</span>
</div> </div>
<div class="box1-top-content-item"> <div class="box1-top-content-item">
<span class="box1-top-content-item-title">· 涉及领域：</span> <span class="box1-top-content-item-title">· 涉及领域：</span>
<div class="box1-top-content-item-tags" v-for="(domainItem, index) in item.domains" <div class="box1-top-content-item-tags"
:key="index"> v-for="(domainItem, index) in item.domains" :key="index">
<el-tag :type="getTagType(domainItem)">{{ domainItem }}</el-tag> <el-tag :type="getTagType(domainItem)">{{ domainItem
}}</el-tag>
</div> </div>
</div> </div>
</div> </div>
...@@ -110,10 +114,11 @@ ...@@ -110,10 +114,11 @@
<div class="box1-bottom"> <div class="box1-bottom">
<div class="box1-bottom-title">· 涉及主要实体：</div> <div class="box1-bottom-title">· 涉及主要实体：</div>
<div class="box1-bottom-content"> <div class="box1-bottom-content">
<div class="box1-bottom-content-item" v-for="(ett, index) in item.sanEntities" :key="index" <div class="box1-bottom-content-item"
v-for="(ett, index) in item.sanEntities" :key="index"
@click="handleEntityClick(ett)"> @click="handleEntityClick(ett)">
<el-image v-if="ett.img" class="box1-bottom-content-item-img" :src="ett.img" <el-image v-if="ett.img" class="box1-bottom-content-item-img"
alt=""></el-image> :src="ett.img" alt=""></el-image>
<div v-else class="box1-bottom-content-item-imgUndefined"> <div v-else class="box1-bottom-content-item-imgUndefined">
{{ {{
(ett.entityNameZh || ett.enName)?.match( (ett.entityNameZh || ett.enName)?.match(
...@@ -186,8 +191,9 @@ ...@@ -186,8 +191,9 @@
</div> </div>
</template> </template>
</custom-container> --> </custom-container> -->
<RiskSignal :list="warningList" @item-click="handleToRiskSignalDetail" @more-click="handleToMoreRiskSignal" <RiskSignal :list="warningList" @item-click="handleToRiskSignalDetail"
riskLevel="signalLevel" postDate="signalTime" name="signalTitle" /> @more-click="handleToMoreRiskSignal" riskLevel="signalLevel" postDate="signalTime"
name="signalTitle" />
</el-col> </el-col>
...@@ -246,18 +252,21 @@ ...@@ -246,18 +252,21 @@
<el-table-column label="发布次数" width="200"> <el-table-column label="发布次数" width="200">
<template #default="scope"> <template #default="scope">
<div style="display: flex; align-items: center"> <div style="display: flex; align-items: center">
<span style="margin-right: 10px; width: 40px">{{ scope.row.num }}次</span> <span style="margin-right: 10px; width: 40px">{{ scope.row.num
<el-progress :percentage="scope.row.percent * 100" :show-text="false" }}次</span>
:status="getStatus(scope.row.percent)" /> <el-progress :percentage="scope.row.percent * 100"
:show-text="false" :status="getStatus(scope.row.percent)" />
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="重点领域" width="280" align="center"> <el-table-column label="重点领域" width="280" align="center">
<template #default="scope"> <template #default="scope">
<div style="display: flex; justify-content: center; align-items: center; gap: 5px"> <div
<el-tag v-for="tag in scope.row.tags" :key="tag" :type="getTagType(tag)">{{ style="display: flex; justify-content: center; align-items: center; gap: 5px">
tag <el-tag v-for="tag in scope.row.tags" :key="tag"
}}</el-tag> :type="getTagType(tag)">{{
tag
}}</el-tag>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -270,18 +279,21 @@ ...@@ -270,18 +279,21 @@
<el-table-column label="发布次数" width="200"> <el-table-column label="发布次数" width="200">
<template #default="scope"> <template #default="scope">
<div style="display: flex; align-items: center"> <div style="display: flex; align-items: center">
<span style="margin-right: 10px; width: 40px">{{ scope.row.num }}次</span> <span style="margin-right: 10px; width: 40px">{{ scope.row.num
<el-progress :percentage="scope.row.percent * 100" :show-text="false" }}次</span>
:status="getStatus(scope.row.percent)" /> <el-progress :percentage="scope.row.percent * 100"
:show-text="false" :status="getStatus(scope.row.percent)" />
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="重点领域" width="280" align="center"> <el-table-column label="重点领域" width="280" align="center">
<template #default="scope"> <template #default="scope">
<div style="display: flex; justify-content: center; align-items: center; gap: 5px"> <div
<el-tag v-for="tag in scope.row.tags" :key="tag" :type="getTagType(tag)">{{ style="display: flex; justify-content: center; align-items: center; gap: 5px">
tag <el-tag v-for="tag in scope.row.tags" :key="tag"
}}</el-tag> :type="getTagType(tag)">{{
tag
}}</el-tag>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -294,18 +306,20 @@ ...@@ -294,18 +306,20 @@
<el-table-column label="发布次数" width="180"> <el-table-column label="发布次数" width="180">
<template #default="scope"> <template #default="scope">
<div style="display: flex; align-items: center"> <div style="display: flex; align-items: center">
<span style="margin-right: 10px; width: 40px">{{ scope.row.num }}次</span> <span style="margin-right: 10px; width: 40px">{{ scope.row.num
<el-progress :percentage="scope.row.percent * 100" :show-text="false" }}次</span>
:status="getStatus(scope.row.percent)" /> <el-progress :percentage="scope.row.percent * 100"
:show-text="false" :status="getStatus(scope.row.percent)" />
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="重点领域" width="180"> <el-table-column label="重点领域" width="180">
<template #default="scope"> <template #default="scope">
<div style="display: flex; align-items: center; gap: 5px"> <div style="display: flex; align-items: center; gap: 5px">
<el-tag v-for="tag in scope.row.tags" :key="tag" :type="getTagType(tag)">{{ <el-tag v-for="tag in scope.row.tags" :key="tag"
tag :type="getTagType(tag)">{{
}}</el-tag> tag
}}</el-tag>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -334,7 +348,8 @@ ...@@ -334,7 +348,8 @@
<div style="display: flex; align-items: center; gap: 16px"> <div style="display: flex; align-items: center; gap: 16px">
<el-checkbox v-model="trendChecked" label="50%规则" size="large" /> <el-checkbox v-model="trendChecked" label="50%规则" size="large" />
<el-select v-model="selectedEntityId" placeholder="请选择清单类型" style="width: 160px"> <el-select v-model="selectedEntityId" placeholder="请选择清单类型" style="width: 160px">
<el-option v-for="item in infoList" :key="item.id" :label="item.nameZh" :value="item.id" /> <el-option v-for="item in infoList" :key="item.id" :label="item.nameZh"
:value="item.id" />
</el-select> </el-select>
</div> </div>
</template> </template>
...@@ -360,18 +375,22 @@ ...@@ -360,18 +375,22 @@
<template #default> <template #default>
<div class="box4"> <div class="box4">
<div style="height: 90%; overflow-y: auto; padding-top: 10px"> <div style="height: 90%; overflow-y: auto; padding-top: 10px">
<div class="box4-item" v-for="(item, idx) in sanctionProcessList" :key="item.title"> <div class="box4-item" v-for="(item, idx) in sanctionProcessList"
:key="item.title">
<div class="box4-item-left"> <div class="box4-item-left">
<el-image :src="dotIcon" alt="图片" class="box4-item-left-icon" /> <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>
<div class="box4-item-right"> <div class="box4-item-right">
<div class="box4-item-right-header" @click="handleSanc(item)"> <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> <span class="box4-item-right-header-desc">{{ item.desc }}</span>
</div> </div>
<el-tooltip effect="dark" :content="item.content" popper-class="common-prompt-popper" <el-tooltip effect="dark" :content="item.content"
placement="top" :show-after="500"> popper-class="common-prompt-popper" placement="top"
:show-after="500">
<div class="box4-item-right-content"> <div class="box4-item-right-content">
{{ item.content }} {{ item.content }}
</div> </div>
...@@ -379,7 +398,8 @@ ...@@ -379,7 +398,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="box4-footer" :style="{ marginTop: sanctionProcessList.length > 0 ? '0px' : 'auto' }"> <div class="box4-footer"
:style="{ marginTop: sanctionProcessList.length > 0 ? '0px' : 'auto' }">
<el-button type="primary" link @click="handleGetMore">查看更多 <el-button type="primary" link @click="handleGetMore">查看更多
<el-icon> <el-icon>
<DArrowRight /> <DArrowRight />
...@@ -397,8 +417,8 @@ ...@@ -397,8 +417,8 @@
</template> </template>
<template #default> <template #default>
<div class="box5"> <div class="box5">
<el-table :data="entitiesList" class="sanction-table" stripe empty-text="暂无数据" height="700px" <el-table :data="entitiesList" class="sanction-table" stripe empty-text="暂无数据"
header-row-class-name="table-header" row-class-name="table-row"> height="700px" header-row-class-name="table-header" row-class-name="table-row">
<!-- <el-table-column prop="index" label="序号" width="80" align="center"> <!-- <el-table-column prop="index" label="序号" width="80" align="center">
<template #default="scope"> <template #default="scope">
{{ scope.$index + 1 + (currentPage - 1) * pageSize }} {{ scope.$index + 1 + (currentPage - 1) * pageSize }}
...@@ -408,8 +428,8 @@ ...@@ -408,8 +428,8 @@
<el-table-column prop="name" label="实体名称" min-width="200"> <el-table-column prop="name" label="实体名称" min-width="200">
<template #default="scope"> <template #default="scope">
<div class="tableName" @click="handleCompClick(scope.row)"> <div class="tableName" @click="handleCompClick(scope.row)">
<el-image v-if="scope.row.img" class="box1-bottom-content-item-img" :src="scope.row.img" <el-image v-if="scope.row.img" class="box1-bottom-content-item-img"
alt=""></el-image> :src="scope.row.img" alt=""></el-image>
<div v-else class="box1-bottom-content-item-imgUndefined"> <div v-else class="box1-bottom-content-item-imgUndefined">
{{ {{
(scope.row.name || scope.row.enName)?.match( (scope.row.name || scope.row.enName)?.match(
...@@ -417,7 +437,8 @@ ...@@ -417,7 +437,8 @@
)?.[0] )?.[0]
}} }}
</div> </div>
<CommonPrompt :content="scope.row.name" style="flex: 1; overflow: hidden" /> <CommonPrompt :content="scope.row.name"
style="flex: 1; overflow: hidden" />
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -425,9 +446,10 @@ ...@@ -425,9 +446,10 @@
<el-table-column prop="domains" label="涉及领域" min-width="150"> <el-table-column prop="domains" label="涉及领域" min-width="150">
<template #default="scope"> <template #default="scope">
<div class="domain-tags"> <div class="domain-tags">
<el-tag v-for="tag in scope.row.domains" :key="tag" :type="getTagType(tag)">{{ <el-tag v-for="tag in scope.row.domains" :key="tag"
tag :type="getTagType(tag)">{{
}}</el-tag> tag
}}</el-tag>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -466,7 +488,8 @@ ...@@ -466,7 +488,8 @@
]"> ]">
{{ scope.row.ruleOrgList[0].orgName }}...等 {{ scope.row.ruleOrgList[0].orgName }}...等
</div> </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 }}家> {{ scope.row.ruleOrgCount }}家>
</div> </div>
</div> </div>
...@@ -478,8 +501,9 @@ ...@@ -478,8 +501,9 @@
<!-- <div class="pagination-info"> <!-- <div class="pagination-info">
第{{ currentPage }}页，共{{ totalPages }}页 第{{ currentPage }}页，共{{ totalPages }}页
</div> --> </div> -->
<el-pagination v-model:current-page="currentPage" :page-size="pageSize" :total="total" <el-pagination v-model:current-page="currentPage" :page-size="pageSize"
:pager-count="5" layout="prev, pager, next" background @current-change="handlePageChange" /> :total="total" :pager-count="5" layout="prev, pager, next" background
@current-change="handlePageChange" />
</div> </div>
</div> </div>
</template> </template>
...@@ -500,9 +524,10 @@ ...@@ -500,9 +524,10 @@
<div class="left-main"> <div class="left-main">
<el-checkbox-group v-model="checkedTech"> <el-checkbox-group v-model="checkedTech">
<div class="checkbox-grid"> <div class="checkbox-grid">
<el-checkbox v-for="item in techOptions" :key="item.value" :label="item.value">{{ <el-checkbox v-for="item in techOptions" :key="item.value"
item.label :label="item.value">{{
}}</el-checkbox> item.label
}}</el-checkbox>
</div> </div>
</el-checkbox-group> </el-checkbox-group>
</div> </div>
...@@ -533,10 +558,12 @@ ...@@ -533,10 +558,12 @@
</div> </div>
<img :src="item.orgLogoUrl || comTitle" alt="" /> <img :src="item.orgLogoUrl || comTitle" alt="" />
<div class="main"> <div class="main">
<div class="main-title" @click="handleTitleClick(item)">{{ item.title }}</div> <div class="main-title" @click="handleTitleClick(item)">{{ item.title }}
</div>
<div class="main-desc">{{ item.desc }}</div> <div class="main-desc">{{ item.desc }}</div>
<div class="tag-box"> <div class="tag-box">
<div v-for="tag in item.tags" :key="tag" class="tag-item">{{ tag }}</div> <div v-for="tag in item.tags" :key="tag" class="tag-item">{{ tag }}
</div>
</div> </div>
<div :class="{ 'count-tag': item.countTag }">{{ item.countTag }}</div> <div :class="{ 'count-tag': item.countTag }">{{ item.countTag }}</div>
...@@ -545,8 +572,9 @@ ...@@ -545,8 +572,9 @@
</div> </div>
<div class="right-footer"> <div class="right-footer">
<div class="total-count">共 {{ totalAll }} 项</div> <div class="total-count">共 {{ totalAll }} 项</div>
<el-pagination v-model:current-page="currentPageAll" :page-size="pageSizeAll" :total="totalAll" <el-pagination v-model:current-page="currentPageAll" :page-size="pageSizeAll"
layout="prev, pager, next" background @current-change="handlePageChangeAll" /> :total="totalAll" layout="prev, pager, next" background
@current-change="handlePageChangeAll" />
</div> </div>
</div> </div>
</div> </div>
...@@ -598,7 +626,7 @@ ...@@ -598,7 +626,7 @@
</template> </template>
<script setup> <script setup>
import NewsList from "@/components/NewsList/NewsList.vue"; import NewsList from "@/components/NewsList.vue";
import RiskSignal from "@/components/RiskSignal/RiskSignal.vue"; import RiskSignal from "@/components/RiskSignal/RiskSignal.vue";
import { onMounted, ref, computed, reactive, shallowRef, watch, nextTick } from "vue"; import { onMounted, ref, computed, reactive, shallowRef, watch, nextTick } from "vue";
import { useContainerScroll } from "@/hooks/useScrollShow"; import { useContainerScroll } from "@/hooks/useScrollShow";
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论