提交 bdeb5f0c authored 作者: 胡卉清's avatar 胡卉清

合并分支 'dev_hhq' 到 'master'

Dev hhq 查看合并请求 !90
//ZM博弈概览
import ZMGame from "@/views/ZMGame/index.vue";
const ZMGameRoutes = [
//创新主体
{
path: "/ZMGame",
name: "ZMGame",
component: ZMGame,
meta: {
title: "ZM博弈概览"
}
}
]
export default ZMGameRoutes
\ No newline at end of file
<!--今日风险-->
<template>
<div class="content-wrapper">
今日风险
</div>
</template>
<script setup>
import { onMounted, ref, computed } from "vue";
</script>
<style lang="scss" scoped>
.content-wrapper {
width: 100%;
height: 100%;
}
</style>
\ No newline at end of file
<!--科技要闻-->
<template>
<div class="content-wrapper">
科技要闻
</div>
</template>
<script setup>
import { onMounted, ref, computed } from "vue";
</script>
<style lang="scss" scoped>
.content-wrapper {
width: 100%;
height: 100%;
}
</style>
\ No newline at end of file
<!--ZM博弈概览页-->
<template>
<div class="home-wrapper">
<div class="home-header">
<div class="header-left">
<HeaderMenu></HeaderMenu>
</div>
<div class="header-right">
<input :value="input">
</div>
</div>
<div class="content-box">
<div class="btn-box">
<div v-for="item in riskItems" :key="item" :class="aciveBtn === item ? 'btn-select' : 'btn'"
@click="aciveBtn = item">
<img src="./assets/icons/btn-select-icon.png" v-if="aciveBtn === item" class="btn-icon" />{{
item }}
</div>
</div>
<RiskToday v-if="aciveBtn === '最新风险动态'" />
<ScienceNews v-if="aciveBtn === '最新科技要闻'" />
</div>
</div>
</template>
<script setup>
import { onMounted, ref, computed } from "vue";
import HeaderMenu from "@/components/headerMenu.vue";
import RiskToday from './component/riskToday/index.vue'
import ScienceNews from './component/scienceNews/index.vue'
const input = ref('')
const riskItems = ref([
"最新风险动态", "最新科技要闻", "美对我打压遏制TS", "中美科技博弈概况"
]);
const aciveBtn = ref('最新风险动态')
</script>
<style lang="scss" scoped>
.home-wrapper {
width: 100%;
height: 100%;
position: relative;
overflow-y: hidden;
.home-header {
height: 64px;
background: url("./assets/images/header-bg.png");
box-sizing: border-box;
padding: 0 160px;
display: flex;
justify-content: space-between;
}
.content-box {
width: 100%;
height: 100%;
padding: 16px 160px;
.btn-box {
/* 概览页导航 */
width: 1598px;
height: 55px;
/* 自动布局 */
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
gap: 8;
padding: 4px 5px 4px 5px;
margin-bottom: 20px;
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);
font-family: YouSheBiaoTiHei;
color: rgba(59, 65, 75, 1);
font-family: YouSheBiaoTiHei;
font-style: Regular;
font-size: 24px;
font-weight: 400;
line-height: 31px;
letter-spacing: 0px;
text-align: center;
.btn {
/* 容器 1464 */
width: 391px;
height: 47px;
/* 自动布局 */
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
gap: 10;
padding: 8px 66px 8px 66px;
}
.btn-select {
/* 容器 1462 */
width: 391px;
height: 47px;
padding: 8px 66px 8px 66px;
box-sizing: border-box;
border: 1px solid rgba(174, 214, 255, 1);
border-radius: 10px;
background: rgba(246, 250, 255, 1);
}
.btn-icon {
/* 容器 1554 */
width: 18px;
height: 18px;
margin-right: 10px;
}
}
}
}
</style>
\ No newline at end of file
......@@ -664,6 +664,18 @@ onMounted(async () => {
}
.content {
display: -webkit-box;
-webkit-line-clamp: 2;
/* 限制显示两行 */
-webkit-box-orient: vertical;
/* 垂直排列内容 */
overflow: hidden;
/* 隐藏超出部分 */
text-overflow: ellipsis;
/* 显示省略号 */
/* Text */
width: 862px;
height: 48px;
margin-top: 8px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
......
......@@ -17,10 +17,8 @@
</el-select>
</div>
<div class="left-main">
<div class="left-main-echarts" ref="leftChartRef" v-show="radio1 === true">资助经费</div>
<div class="left-main-echarts" ref="leftChartRef1" v-show="radio1 === false">资助项目</div>
</div>
</div>
<div class="left">
......@@ -41,18 +39,25 @@
<div class="right-title">
<img src="./assets/icon02.png" alt="" />
<div class="tit">资助经费变化情况</div>
<div :class="radio2 === true ? 'btn-select' : 'btn'" style=" right:250px;" @click="changeradio2()">
资助经费
</div>
<div :class="radio2 === false ? 'btn-select' : 'btn'" style=" right: 150px;" @click="changeradio2()">
资助项目
</div>
<el-select v-model="value" placeholder="Select" class="select">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<div class="right-main">
<div class="right-main-echarts" ref="rightChartRef"></div>
<div class="right-main-echarts" ref="rightChartRef" v-show="radio2 === true"></div>
<div class="right-main-echarts" ref="rightChartRef1" v-show="radio2 === false"></div>
<div class="right-main-tit">亿美元</div>
</div>
</div>
<div class="right">
<div class="right-title">
<img src="./assets/icon03.png" alt="" />
<img src="./assets/icon04.png" alt="" />
<div class="tit">项目资助强度分布</div>
<el-select v-model="value3" placeholder="Select" class="select">
<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
......@@ -213,6 +218,12 @@ const initLeftDonut = (rawData, show) => {
};
const rightChartRef = ref(null);
const rightChartRef1 = ref(null);
const radio2 = ref(true)
const changeradio2 = () => {
radio2.value ? handlegetCountryFundingChange() : handlegetCountryFundProjectChange()
radio2.value = !radio2.value
}
// 资助体系v2.0:资助经费变化情况:资助经费
const handlegetCountryFundingChange = async () => {
try {
......@@ -229,8 +240,6 @@ const handlegetCountryFundingChange = async () => {
}
};
//资助体系v2.0:资助经费变化情况:资助项目
// getCountryFundProjectChange
const fundProjectChange = ref([])
const handlegetCountryFundProjectChange = async () => {
try {
let params = {
......@@ -411,17 +420,16 @@ const initBoxPlot = (data) => {
let leftChart;
let leftChart1;
let rightChart;
// let rightChart;
// let rightChart1;
let leftSankey;
let boxplotChart;
//资助经费变化情况
const initRightLine = (data) => {
if (!rightChartRef.value) return;
if (rightChart) rightChart.dispose();
rightChart = echarts.init(rightChartRef.value);
const initRightLine = (data, show) => {
const colorMap = [
"rgba(20, 89, 187, 1)",
"rgba(206, 79, 81, 1)",
......@@ -512,7 +520,15 @@ const initRightLine = (data) => {
},
series: series
};
rightChart.setOption(option);
if (show == true) {
let rightChart = echarts.init(rightChartRef.value);
rightChart.setOption(option);
} else {
let rightChart1 = echarts.init(rightChartRef1.value);
rightChart1.setOption(option);
}
};
const leftSankeyRef = ref(null);
......@@ -733,10 +749,8 @@ onMounted(() => {
padding: 52px 60px 78px 61px;
.left-main-echarts {
width: 100%;
/* 确保宽度占满容器 */
height: 400px;
/* 设置一个合适的高度 */
width: 780px;
height: 350px;
}
}
......@@ -816,8 +830,9 @@ onMounted(() => {
position: relative;
.right-main-echarts {
width: 100%;
height: 100%;
/* 矢量 476 */
width: 780px;
height: 350px;
}
.right-main-tit {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论