提交 727de69b authored 作者: huhuiqing's avatar huhuiqing

Merge branch 'master' of http://8.140.26.4:10003/caijian/risk-monitor into dev_hhq

......@@ -1346,7 +1346,7 @@ onUnmounted(() => {});
font-family: Microsoft YaHei;
font-size: 20px;
font-weight: 400;
line-height: 36px;
line-height: 32px;
margin-left: 5px;
}
.btn-icon {
......@@ -1492,6 +1492,7 @@ onUnmounted(() => {});
margin: 0 16px;
background: #e7f3ff;
cursor: pointer;
position: relative;
&:hover {
background: #cae3fc;
}
......@@ -1500,11 +1501,13 @@ onUnmounted(() => {});
font-family: Microsoft YaHei;
font-size: 20px;
font-weight: 400;
line-height: 44px;
line-height: 42px;
margin-left: 5px;
}
.btn-icon {
margin-left: 20px;
position: absolute;
top: 0;
right: 10px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-size: 20px;
......
......@@ -8,17 +8,28 @@ import { ref, onMounted } from "vue";
import * as echarts from "echarts";
// import { graphData } from "./mockData";
import Img from "./assets/images/img.png";
import Img1 from "./assets/images/img1.png";
import Img2 from "./assets/images/img2.png";
import Img3 from "./assets/images/img3.png";
import Img4 from "./assets/images/img4.png";
import Img5 from "./assets/images/img5.png";
import Img6 from "./assets/images/img6.png";
import Img7 from "./assets/images/img7.png";
import Img8 from "./assets/images/img8.png";
const graphData = {
nodes: [
{ id: "huawei", name: "美国众议院", category: 0, symbolSize: 80 },
{ id: "huawei-cloud", name: "约翰·斯奎尔斯", category: 0, symbolSize: 50 },
{ id: "huawei-digital-energy", name: "马尔科·卢比奥", category: 0, symbolSize: 50 },
{ id: "huawei-intelligent-car", name: "埃隆·马斯克", category: 0, symbolSize: 50 },
{ id: "qualcomm", name: "道格·伯格姆", category: 1, symbolSize: 50 },
{ id: "intel", name: "斯科特·贝森特", category: 1, symbolSize: 50 },
{ id: "mediatek", name: "杰弗里·凯斯勒", category: 1, symbolSize: 50 },
{ id: "shenghongda", name: "杰弗里·凯斯勒", category: 1, symbolSize: 50 },
{ id: "foxconn", name: "唐纳德·特朗普", category: 1, symbolSize: 50 }
{ id: "huawei", name: "美国众议院", category: 0, symbolSize: 60, symbol: `image://${Img}` },
{ id: "foxconn", name: "唐纳德·特朗普", category: 1, symbolSize: 42, symbol: `image://${Img1}` },
{ id: "huawei-cloud", name: "约翰·斯奎尔斯", category: 2, symbolSize: 42, symbol: `image://${Img2}` },
{ id: "huawei-digital-energy", name: "马尔科·卢比奥", category: 2, symbolSize: 42, symbol: `image://${Img3}` },
{ id: "huawei-intelligent-car", name: "埃隆·马斯克", category: 2, symbolSize: 42, symbol: `image://${Img4}` },
{ id: "qualcomm", name: "道格·伯格姆", category: 2, symbolSize: 42, symbol: `image://${Img5}` },
{ id: "intel", name: "斯科特·贝森特", category: 2, symbolSize: 42, symbol: `image://${Img6}` },
{ id: "mediatek", name: "杰弗里·凯斯勒", category: 2, symbolSize: 42, symbol: `image://${Img7}` },
{ id: "shenghongda", name: "杰弗里·凯德勒", category: 2, symbolSize: 42, symbol: `image://${Img8}` }
// { id: "luxshare", name: "立讯精密", category: 1, symbolSize: 20 },
// { id: "tianma", name: "天马微电子", category: 1, symbolSize: 20 },
// { id: "desay", name: "德赛电池", category: 1, symbolSize: 20 },
......@@ -86,10 +97,10 @@ onMounted(() => {
const option = {
title: { text: "", left: "center" },
tooltip: {},
legend: {
data: graphData.categories.map(item => item.name),
left: "left"
},
// legend: {
// data: graphData.categories.map(item => item.name),
// left: "left"
// },
series: [
{
type: "graph",
......@@ -104,7 +115,33 @@ onMounted(() => {
roam: true, // 支持缩放、平移
label: {
show: true,
fontSize: 12
fontSize: 14,
position: "bottom",
formatter: function (params) {
// 根据条件返回不同样式的文本
if (params.data.category === 0) {
return `{a|${params.name}}`; // 使用富文本样式
} else if (params.data.category === 1) {
return `{b|${params.name}}`;
} else {
return params.name; // 默认样式
}
},
rich: {
a: {
// 重要节点的样式
color: "#000",
fontSize: 18,
fontWeight: "bold",
padding: [2, 4],
borderRadius: 2
},
b: {
// 普通节点的样式
color: "rgba(5, 95, 194, 1)",
fontSize: 14,
}
}
},
edgeSymbol: ["arrow", "none"], // 边的箭头
edgeSymbolSize: [8, 50],
......@@ -136,7 +173,8 @@ onMounted(() => {
<style scoped>
.chart-container {
width: 100%;
height: 600px;
background-color: #fff; /* 深色背景,模拟原图风格 */
height: 430px;
margin: 0 auto;
background-color: #f7f8f9; /* 深色背景,模拟原图风格 */
}
</style>
......@@ -27,7 +27,7 @@
<div class="resource-content" style="width: 49.25%;margin-left: 1.5%;">
<div class="item-header">
<img class="item-header-icon" src="@/assets/images/icon/resource-icon-2.png"></img>
<div class="item-header-text" style="width: 130px;">创新主体排名</div>
<div class="item-header-text" style="width: 200px; margin-right: 130px;">创新主体排名</div>
<el-radio-group v-model="InnovationRankingBtn" size="small" @change="handleInnovationRankingBtn">
<el-radio-button value="enterprise" border>科技企业
</el-radio-button>
......@@ -95,7 +95,7 @@
</div>
美国
</div>
<el-select v-model="areaSelect" placeholder="" style="width: 150px;float: right;margin-right: 20px;"
<el-select v-model="areaSelect" placeholder="" style="width: 150px;margin-left: 160px;margin-right: 20px;"
size="small">
<el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
......@@ -117,11 +117,11 @@
<div style="display: flex;height: 400px;">
<div style=" width:60%;height: 100%;" id="char4">
</div>
<div style="display: grid;width: 35%;margin: 10px;">
<el-select v-model="areaSelect" placeholder="" style="width: 150px;float: right ;" size="small">
<div style="width: 35%;margin: 20px 10px;">
<el-select v-model="areaSelect" placeholder="" style="width: 120px;margin-left: 150px;" size="small">
<el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<div>
<div style="margin-top: 100px;">
<div style="display: flex;align-items: center;height: 30px;justify-content: space-between;">
<div class="legend-icon" style="background-color:#CE4F51 ;">
</div>
......@@ -198,7 +198,7 @@
</div>
<!-- 右侧选择器 -->
<el-select v-model="paperSelect" placeholder="" style="width: 150px;float: right;margin-right: 20px;"
<el-select v-model="paperSelect" placeholder="" style="width: 150px;float: right;margin-right: 10px;"
size="small">
<el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
......@@ -422,7 +422,7 @@ onMounted(() => {
height: 450px;
box-sizing: border-box;
border: 1px solid rgba(234, 236, 238, 1);
border-radius: var(---, 10px);
border-radius: 10px;
/* 业务系统/模块阴影 */
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1);
......@@ -496,7 +496,7 @@ onMounted(() => {
font-size: 16px;
line-height: 48px;
text-align: right;
margin-left: 30px;
width: calc(100% - 350px);
.item-header-right-icon {
......
......@@ -59,7 +59,7 @@
数据来源:美国某某局</div>
</div>
<div class="item-header-divider"></div>
<div style="display: flex;margin: 10px;">
<div style="display: flex;margin: 10px 20px; justify-content: space-between;">
<el-radio-group v-model="strengthBtn" size="small" @change="handleStrengthBtn">
<el-radio-button value="all" border>全部领域
</el-radio-button>
......@@ -91,11 +91,11 @@
<div style=" width:60%;height: 100%;" id="char2">
</div>
<div style="display: grid;width: 35%;margin: 10px;">
<el-select v-model="areaSelect" placeholder="" style="width: 100px;float: right;margin: 10px;" size="small">
<div style="width: 35%;margin: 10px;">
<el-select v-model="areaSelect" placeholder="" style="width: 120px;margin: 10px; margin-left: 140px;" size="small">
<el-option v-for="item in areaTimeList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<div>
<div style="width: 80%; margin: 60px auto 0;">
<div style="display: flex;align-items: center;height: 30px;justify-content: space-between;">
<div class="legend-icon" style="background-color:#CE4F51 ;">
</div>
......@@ -170,7 +170,7 @@
<script setup>
import { onMounted, ref, computed } from "vue";
import router from '@/router/index'
import router from "@/router/index";
import * as echarts from "echarts";
import DivideHeader from "@/components/DivideHeader.vue";
import Timeline from "../component/Timeline.vue";
......@@ -240,8 +240,8 @@ const distribution = ref([
text: "1626",
unit: "个",
change: "较上月+3",
path: '/billHome',
color: ['#9AC8FF', '#BCDCFF', '#E7F4FF', '#0F5EDB']
path: "/billHome",
color: ["#9AC8FF", "#BCDCFF", "#E7F4FF", "#0F5EDB"]
},
{
titlle: "行政令",
......@@ -249,8 +249,8 @@ const distribution = ref([
text: "1626",
unit: "个",
change: "较上月+1",
path: '/decree',
color: ['#FDE19A', '#FEECBD', '#FFFBE6', '#D68E16']
path: "/decree",
color: ["#FDE19A", "#FEECBD", "#FFFBE6", "#D68E16"]
},
{
titlle: "科技智库",
......@@ -258,8 +258,8 @@ const distribution = ref([
text: "66",
unit: "次",
change: "较上月+2",
path: '/thinkTank',
color: ['#C9AAF0', '#DFCAF6', '#FAF1FF', '#531DAC']
path: "/thinkTank",
color: ["#C9AAF0", "#DFCAF6", "#FAF1FF", "#531DAC"]
},
{
titlle: "出口管制",
......@@ -267,8 +267,8 @@ const distribution = ref([
text: "66",
unit: "次",
change: "较上月+1",
path: '/exportControl',
color: ['#96DFDD', '#BCEFEC', '#E7FFFB', '#006E75']
path: "/exportControl",
color: ["#96DFDD", "#BCEFEC", "#E7FFFB", "#006E75"]
},
{
titlle: "投融资限制",
......@@ -276,8 +276,8 @@ const distribution = ref([
text: "119",
unit: "次",
change: "较上月+1",
path: '/finance',
color: ['#F5BEBC', '#F7D3D0', '#FEF1F0', '#C64C4E']
path: "/finance",
color: ["#F5BEBC", "#F7D3D0", "#FEF1F0", "#C64C4E"]
},
{
titlle: "市场准入",
......@@ -285,8 +285,8 @@ const distribution = ref([
text: "223",
unit: "次",
change: "较上个月+1",
path: '/marketAccessRestrictions',
color: ['#FFE3B9', '#FFEDCE', '#FFF7E6', '#D46B08']
path: "/marketAccessRestrictions",
color: ["#FFE3B9", "#FFEDCE", "#FFF7E6", "#D46B08"]
}
]);
......@@ -321,7 +321,7 @@ const chart1Data = ref({
});
const strengthBtn = ref("all");
function handleStrengthBtn() { }
function handleStrengthBtn() {}
//打压遏制强度变化时间选择器
const strengthSelect = ref("近一年");
const strengthTimeList = ref([
......@@ -374,11 +374,11 @@ const setChart = (option, chartId) => {
};
// 点击打压遏制手段分布 跳转到各个页面
const handleClickItem = (item) => {
const handleClickItem = item => {
router.push({
path: item.path
})
}
});
};
onMounted(() => {
let char1 = getBarChart(chart1Data.value.name, chart1Data.value.value, true);
......@@ -467,7 +467,7 @@ onMounted(() => {
height: 450px;
box-sizing: border-box;
border: 1px solid rgba(234, 236, 238, 1);
border-radius: var(---, 10px);
border-radius: 10px;
/* 业务系统/模块阴影 */
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1);
......
......@@ -107,7 +107,7 @@ import DivideHeader from "@/components/DivideHeader.vue";
import radarChart3 from '../js/radarChart3.js'
//科技实力按钮
const strengthBtn = ref('enterprise')
const strengthBtn = ref('potential')
function handlestrengthBtn() {
}
......@@ -297,6 +297,7 @@ onMounted(() => {
.resource-box {
height: 800px;
// width: 1600px;
}
.title-text {
......@@ -326,7 +327,7 @@ onMounted(() => {
height: 550px;
box-sizing: border-box;
border: 1px solid rgba(234, 236, 238, 1);
border-radius: var(---, 10px);
border-radius: 10px;
/* 业务系统/模块阴影 */
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1);
......
......@@ -5,7 +5,7 @@
<div class="content-title"><span>国家科技安全</span>> <span>中美博弈概览 </span></div>
<!-- 中美博弈最新动态内容-->
<div class="content-box">
<div class="title-text">中美博弈最新动态 </div>
<div class="title-text">中美博弈最新动态</div>
<div class="title-text-small">
提供半导体、AI、量子等关键领域的竞争动态、政策追踪与产业链分析,实时把握中美博弈全局
</div>
......@@ -21,29 +21,39 @@
<div class="item-card" style="">
<div class="item-card-btn-left" @click="changeOrganizationNews('left')">
<img class="item-btn-icon" src="@/assets/images/icon/card-btn-left.png" />
</div>
<!-- 机构动态内容-->
<div class="item-card-content">
<div class="item-card-content-header">
<div style="width: calc(100% - 80px);">
<div style="width: calc(100% - 80px)">
<div class="item-card-content-title">
{{ organizationNews[organizationNewsShow].title }}
</div>
<div class="item-card-content-title-small">
{{ organizationNews[organizationNewsShow].time + ' ' +
organizationNews[organizationNewsShow].adress }}
{{
organizationNews[organizationNewsShow].time +
" · " +
organizationNews[organizationNewsShow].adress
}}
</div>
</div>
<img class="item-card-content-title-image" :src="organizationNews[organizationNewsShow].image" alt="">
<img
class="item-card-content-title-image"
:src="organizationNews[organizationNewsShow].image"
alt=""
/>
</div>
<div class="item-header-divider"></div>
<div class="item-card-content-text ">
<div class="item-card-content-text">
{{ organizationNews[organizationNewsShow].content }}
</div>
<div style="display: flex">
<div class="item-card-content-tag" v-for="tag, index in organizationNews[organizationNewsShow].tag"
:key="index" :style="{ color: tag.textColor, background: tag.color, borderColor: tag.color }">
<div style="display: flex;margin-top: 30px;">
<div
class="item-card-content-tag"
v-for="(tag, index) in organizationNews[organizationNewsShow].tag"
:key="index"
:style="{ color: tag.textColor, background: tag.color, border: `1px solid ${tag.textColor}` }"
>
{{ tag.text }}
</div>
</div>
......@@ -51,12 +61,11 @@
<div class="item-card-btn-right" @click="changeOrganizationNews('right')">
<img class="item-btn-icon" src="@/assets/images/icon/card-btn-right.png" />
</div>
</div>
<div class="item-card-right ">
<div class="item-card-right">
<div class="item-list">
<div v-for="organizationItem, index in organizationList" :key="index" style="height: 40px">
<div style="display: flex;margin: 10px">
<div v-for="(organizationItem, index) in organizationList" :key="index" style="height: 40px">
<div style="display: flex; margin: 10px">
<div class="item-list-punblier">
{{ organizationItem.punblier }}
</div>
......@@ -69,7 +78,6 @@
</div>
<div class="item-header-divider"></div>
</div>
</div>
</div>
</div>
......@@ -78,18 +86,23 @@
<div class="item left">
<div class="item-header">
<img class="item-header-icon" src="@/assets/images/icon/waring-card-header-icon.png" />
<div class="item-header-text" style="background-color: #CE4F51;">风险信号</div>
<div class="item-header-text" style="background-color: #ce4f51">风险信号</div>
<div class="item-header-num" style="background-color: #ce4f51">
<div class="num">{{ warningList.length }}</div>
</div>
</div>
<div class="item-header-divider"></div>
<div style="padding: 30px 23px;height: 350px;">
<div style="padding: 30px 23px; height: 400px">
<div class="waring-item" v-for="(item, index) in warningList" :key="index">
<div style="display: flex;height: 40px;">
<div class="waring-status" :style="{
color: item.status === 0 ? '#CE4F51' : item.status === 1 ? '#FA8C16' : '#52C41A',
backgroundColor: item.status === 0 ? '#FFF1F0' : item.status === 1 ? '#FFF7E6' : '#F6FFED'
}">
{{ item.status === 0 ? '特别重大' : item.status === 1 ? '重大风险' : '一般风险'
}}
<div style="display: flex; height: 40px">
<div
class="waring-status"
:style="{
color: item.status === 0 ? '#CE4F51' : item.status === 1 ? '#FA8C16' : '#52C41A',
backgroundColor: item.status === 0 ? '#FFF1F0' : item.status === 1 ? '#FFF7E6' : '#F6FFED'
}"
>
{{ item.status === 0 ? "特别重大" : item.status === 1 ? "重大风险" : "一般风险" }}
</div>
<div class="waring-text">
{{ item.title }}
......@@ -97,26 +110,28 @@
<div class="waring-time">{{ item.time }}</div>
</div>
<div class="item-header-divider"></div>
</div>
</div>
<div class="item-btn">
查看更多
<div class="item-btn" @click="handleToMoreRiskSignal">
<div class="icon">
<img src="@/assets/images/more-signal.png" alt="" />
</div>
<div class="text">{{ "查看更多" }}</div>
</div>
</div>
<!--新闻资讯-->
<div class="item right">
<div class="item-header">
<img class="item-header-icon" src="@/assets/images/icon/news-card-header-icon.png" />
<div class="item-header-text" style="background: rgba(255, 255, 255, 0.65) ;color:#055FC2">新闻资讯</div>
<div class="item-header-more" style=" color:#055FC2">更多 +</div>
<div class="item-header-text" style="background: rgba(255, 255, 255, 0.65); color: #055fc2">新闻资讯</div>
<div class="item-header-more" style="color: #055fc2; cursor: pointer;" @click="handleToMoreNews">更多 +</div>
</div>
<div class="item-header-divider"></div>
<div class="news-box">
<div v-for="item, index in newsList" :key="index" class="news-box-item">
<div style=" display: flex;">
<div v-for="(item, index) in newsList" :key="index" class="news-box-item">
<div style="display: flex">
<img :src="item.image" />
<div style="padding: 0 10px ;">
<div style="padding: 0 10px">
<div class="news-box-title">
{{ item.title }}
</div>
......@@ -132,20 +147,20 @@
<div class="item right">
<div class="item-header">
<img class="item-header-icon" src="@/assets/images/icon/people-card-header-icon.png" />
<div class="item-header-text" style="background: rgba(255, 255, 255, 0.65) ;color:#055FC2">人物动态</div>
<div class="item-header-more" style=" color:#055FC2">更多 +</div>
<div class="item-header-text" style="background: rgba(255, 255, 255, 0.65); color: #055fc2">人物动态</div>
<div class="item-header-more" style="color: #055fc2">更多 +</div>
</div>
<div class="item-header-divider"></div>
<div class="character-box">
<div class="character-item" v-for="item, index in characterDynamics" :key="index">
<div class="character-item" v-for="(item, index) in characterDynamics" :key="index">
<img :src="item.image" class="character-image" />
<div class="talk-box">
<div style="display: flex;">
<div style="display: flex">
<div class="talk-title">
{{ item.name }}
</div>
<div style="width: 60%;text-align: right;">
{{ item.position + '.' + item.time }}
<div style="width: 60%; text-align: right">
{{ item.position + "." + item.time }}
</div>
</div>
{{ item.talk }}
......@@ -159,9 +174,7 @@
<ResourceSupport />
<strengthComparison />
</div>
</div>
</div>
</template>
......@@ -172,9 +185,23 @@ import ResourceSupport from "./component/ResourceSupport.vue";
import strengthComparison from "./component/strengthComparison.vue";
import router from "@/router";
import { color } from "echarts";
// 查看更多风险信号
const handleToMoreRiskSignal = () => {
const route = router.resolve("/riskSignal");
window.open(route.href, "_blank");
};
// 查看更多新闻资讯
const handleToMoreNews = () => {
const route = router.resolve("/newsBrief");
window.open(route.href, "_blank");
};
const organizationNews = ref([
{
title: "1美国白宫发布关于进一步延长TikTok执法宽限期的行政令",
title: "美国白宫发布关于进一步延长TikTok执法宽限期的行政令",
time: "2025年9月16日",
adress: "美国白宫",
image: "/testData/organizationNews-image1.png",
......@@ -203,12 +230,14 @@ const organizationNews = ref([
tag: [
{
color: "#F5222D",
textColor: " #FFF1F0",
textColor: "#FFF1F0",
borderColor: 'rgba(255, 163, 158, 1)',
text: "人工智能"
},
{
color: "#E6F4FF",
textColor: " #1677FF",
textColor: "#1677FF",
borderColor: 'rgba(145, 202, 255, 1)',
text: "通信网络"
}
]
......@@ -369,7 +398,7 @@ function changeOrganizationNews(type) {
: (organizationNewsShow.value = organizationNewsShow.value + 1);
}
}
onMounted(() => { });
onMounted(() => {});
</script>
<style lang="scss" scoped>
......@@ -378,8 +407,10 @@ onMounted(() => { });
height: 100%;
overflow: hidden;
font-family: Microsoft YaHei;
background-color: #ffffff;
background-image: url("./assets/images/bg.png");
background-repeat: no-repeat;
background-size: 100% auto;
background-color: #fff;
.content-title {
height: 64px;
color: #fff;
......@@ -438,8 +469,8 @@ onMounted(() => { });
height: 500px;
justify-content: center;
box-sizing: border-box;
border: 1px solid var(--主色/白色主色, rgba(255, 255, 255, 1));
border-radius: var(---, 10px);
border: 1px solid rgba(255, 255, 255, 1);
border-radius: 10px;
/* 业务系统/模块阴影 */
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 0.65);
......@@ -452,7 +483,7 @@ onMounted(() => { });
.item-header-icon {
width: 20px;
height: 20px;
margin: 15px;
margin: 15px 20px;
}
.item-header-text {
......@@ -463,6 +494,25 @@ onMounted(() => { });
font-size: 20px;
line-height: 48px;
text-align: center;
font-weight: bold;
}
.item-header-num {
width: 30px;
display: flex;
justify-content: flex-start;
align-items: center;
.num {
width: 24px;
height: 20px;
border-radius: 100px;
background: rgba(255, 255, 255, 0.3);
color: rgba(255, 255, 255, 1);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
line-height: 22px;
text-align: center;
}
}
.item-header-more {
......@@ -498,6 +548,7 @@ onMounted(() => { });
box-sizing: border-box;
border: 1px;
border-radius: 4px;
border: 1px solid transparent;
}
.item-content {
......@@ -511,7 +562,7 @@ onMounted(() => { });
height: 100%;
display: flex;
box-sizing: border-box;
border: 1px solid var(--主色/白色主色, rgba(255, 255, 255, 1));
border: 1px solid rgba(255, 255, 255, 1);
border-radius: 10px;
/* 业务系统/模块阴影 */
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
......@@ -529,11 +580,11 @@ onMounted(() => { });
padding: 20px;
.item-card-content-header {
height: 110px;
display: flex;
justify-content: space-between;
.item-card-content-title {
color: var(rgba(59, 65, 75, 1));
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 20px;
font-weight: 700;
......@@ -549,7 +600,8 @@ onMounted(() => { });
}
.item-card-content-title-small {
color: var(rgba(95, 101, 108, 1));
margin-top: 15px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 16px;
......@@ -561,12 +613,13 @@ onMounted(() => { });
}
.item-card-content-title-image {
height: 50px;
width: 50px;
height: 80px;
width: 80px;
}
.item-card-content-text {
color: var(rgba(95, 101, 108, 1));
margin-top: 16px;
color:rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 16px;
......@@ -648,41 +701,43 @@ onMounted(() => { });
}
.waring-item {
height: 48px;
cursor: pointer;
margin: 0 auto;
&:hover {
background: var(--color-bg-hover);
}
.waring-status {
width: 40px;
height: 40px;
border-radius: 50%;
padding: 2px;
padding: 4px;
font-size: 12px;
text-align: center;
box-sizing: border-box;
}
.waring-text {
color: rgba(59, 65, 75, 1);
width: calc(100% - 80px);
width: calc(100% - 120px);
padding: 0 16px;
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 30px;
letter-spacing: 0px;
line-height: 48px;
text-align: justify;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
text-overflow: ellipsis;
word-break: break-all;
white-space: nowrap;
}
.waring-time {
width: 68px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
line-height: 48px;
letter-spacing: 0px;
text-align: right;
}
......@@ -698,19 +753,30 @@ onMounted(() => { });
flex-direction: row;
justify-content: center;
align-items: center;
gap: 8;
gap: 8px;
padding: 5px 16px 5px 16px;
border-radius: 6px;
background: rgba(5, 95, 194, 1);
color: rgba(255, 255, 255, 1);
cursor: pointer;
.icon {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
color: rgba(255, 255, 255, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: center;
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: center;
}
}
/* 新闻资讯 */
......
......@@ -62,7 +62,7 @@
:class="{ tempActive: tempActiveIndex === index }"
v-for="(temp, index) in tempList"
:key="index"
@click="handleClickTemp(item, index)"
@click="handleClickTemp(temp, index)"
>
<div class="header">
<div class="title">{{ temp.title }}</div>
......@@ -359,7 +359,7 @@ const tabList = ref([
]);
const tempList = ref([
{
title: "法案",
title: "法案1",
desc: "基于法案内容生成各维度的综合分析报告"
},
{
......@@ -381,6 +381,7 @@ const tempActiveIndex = ref(0);
const handleClickTemp = (item, index) => {
tempActiveIndex.value = index;
curTempTitle.value = item.title;
};
// 导出
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论