提交 a516b90f authored 作者: coderBryanFu's avatar coderBryanFu

update

上级 18829f75
......@@ -3,42 +3,44 @@
<div class="pro-wrapper">
<div class="home-page">
<div class="navbar">
<div class="nav-left">
<div class="icon">
<img src="@/assets/icons/overview/logo.png" alt="" />
</div>
<div class="title-box">
<div
class="title"
:aria-disabled="item.disabled"
v-for="(item, index) in homeTitleList"
:key="index"
@mouseenter="handleShowMenu(index, true)"
@mouseleave="handleShowMenu(index, false)"
>
<div class="text" :class="{ textActive: homeActiveTitleIndex === index }">
{{ item.name }}
<div class="nav-content">
<div class="nav-left">
<div class="icon">
<img src="@/assets/icons/overview/logo.png" alt="" />
</div>
<div class="title-box">
<div
class="title"
v-for="(item, index) in homeTitleList"
:key="index"
@mouseenter="handleShowMenu(index, true)"
@mouseleave="handleShowMenu(index, false)"
@click="handleClickTitle(item)"
>
<div class="text" :class="{ textActive: homeActiveTitleIndex === index }">
{{ item.name }}
</div>
<div class="bottom-line" v-if="homeActiveTitleIndex === index"></div>
</div>
<div class="bottom-line" v-if="homeActiveTitleIndex === index"></div>
</div>
</div>
</div>
<div class="nav-right">
<div class="search-box">
<div class="input"><el-input type="text" v-model="searchText" @keyup.enter="handleSearch" /></div>
<div class="nav-right">
<div class="search-box">
<div class="input"><el-input type="text" v-model="searchText" @keyup.enter="handleSearch" /></div>
<div class="icon" @click="handleSearch">
<img src="@/assets/icons/overview/search.png" alt="" />
</div>
</div>
<div class="info-box" aria-disabled="true">
<div class="mail">
<img src="@/assets/icons/overview/mail.png" alt="" />
<div class="icon" @click="handleSearch">
<img src="@/assets/icons/overview/search.png" alt="" />
</div>
</div>
<div class="user">
<img src="@/assets/icons/overview/user.png" alt="" />
<div class="info-box" @click="handleClickToolBox">
<div class="mail">
<img src="@/assets/icons/overview/mail.png" alt="" />
</div>
<div class="user">
<img src="@/assets/icons/overview/user.png" alt="" />
</div>
<div class="name">{{ "管理员" }}</div>
</div>
<div class="name">{{ "管理员" }}</div>
</div>
</div>
</div>
......@@ -81,7 +83,7 @@
</div>
</div> -->
<div class="right-btn" aria-disabled="true">
<div class="right-btn" @click="handleClickToolBox">
<div class="item">
<div class="icon">
<img src="@/assets/icons/overview/domain.png" alt="" />
......@@ -96,7 +98,7 @@
</div>
</div>
<div class="tool-box" aria-disabled="true">
<div class="tool-box" @click="handleClickToolBox">
<div class="tool-item">
<img src="@/assets/icons/tool-item-icon1.png" alt="" />
</div>
......@@ -147,6 +149,7 @@ import Menu9 from "@/assets/icons/overview/menu9.png";
import Menu10 from "@/assets/icons/overview/menu10.png";
import Menu11 from "@/assets/icons/overview/menu11.png";
import Menu12 from "@/assets/icons/overview/menu12.png";
import { ElMessage } from "element-plus";
const router = useRouter();
const route = useRoute();
......@@ -321,6 +324,16 @@ const handleSearch = () => {
window.open(curRoute.href, "_blank");
};
const handleClickTitle = item => {
if (item.name === "主要国家科技动向感知" || item.name === "主要国家竞争科技安全") {
ElMessage.warning("当前功能正在开发中,敬请期待!");
}
};
const handleClickToolBox = () => {
ElMessage.warning("当前功能正在开发中,敬请期待!");
};
onMounted(() => {
handleGetPersonType();
});
......@@ -376,123 +389,130 @@ body {
height: 100%;
position: relative;
.navbar {
width: 100%;
height: 64px;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: linear-gradient(180deg, rgba(246, 250, 255, 0.8) 0%, rgba(255, 255, 255, 0.8) 100%);
display: flex;
justify-content: space-between;
.nav-left {
.nav-content {
width: 1600px;
height: 64px;
margin-left: 161px;
margin: 0 auto;
display: flex;
.icon {
margin-top: 17px;
width: 29px;
height: 30px;
img {
width: 100%;
height: 100%;
}
}
.title-box {
display: flex;
justify-content: space-between;
.nav-left {
height: 64px;
margin-left: 21px;
gap: 33px;
.title {
height: 64px;
cursor: pointer;
&:hover {
.text {
color: var(--color-main-active);
}
}
.text {
height: 39px;
margin-top: 12px;
color: rgba(59, 65, 75, 1);
font-family: YouSheBiaoTiHei;
font-style: Regular;
font-size: 30px;
font-weight: 400;
line-height: 39px;
letter-spacing: 0px;
}
.textActive {
color: var(--color-main-active);
}
.bottom-line {
width: 50px;
height: 4px;
margin: 0 auto;
margin-top: 9px;
background: var(--color-main-active);
}
}
}
}
.nav-right {
display: flex;
justify-content: flex-end;
margin-right: 159px;
gap: 21px;
.search-box {
margin-top: 16px;
width: 300px;
height: 36px;
box-sizing: border-box;
border: 1px solid rgba(231, 243, 255, 1);
border-radius: 10px;
background: rgba(231, 243, 255, 1);
display: flex;
.input {
width: 264px;
height: 36px;
}
.icon {
width: 18px;
height: 18px;
margin-left: 9px;
margin-top: 9px;
margin-top: 17px;
width: 29px;
height: 30px;
img {
width: 100%;
height: 100%;
}
}
.title-box {
display: flex;
height: 64px;
margin-left: 21px;
gap: 33px;
.title {
height: 64px;
cursor: pointer;
&:hover {
.text {
color: var(--color-main-active);
}
}
.text {
height: 39px;
margin-top: 12px;
color: rgba(59, 65, 75, 1);
font-family: YouSheBiaoTiHei;
font-style: Regular;
font-size: 30px;
font-weight: 400;
line-height: 39px;
letter-spacing: 0px;
}
.textActive {
color: var(--color-main-active);
}
.bottom-line {
width: 50px;
height: 4px;
margin: 0 auto;
margin-top: 9px;
background: var(--color-main-active);
}
}
}
}
.info-box {
height: 64px;
.nav-right {
display: flex;
justify-content: flex-end;
align-items: center;
.mail {
width: 32px;
height: 32px;
margin-right: 14px;
img {
width: 100%;
height: 100%;
gap: 21px;
.search-box {
margin-top: 16px;
width: 300px;
height: 36px;
box-sizing: border-box;
border: 1px solid rgba(231, 243, 255, 1);
border-radius: 10px;
background: rgba(231, 243, 255, 1);
display: flex;
.input {
width: 264px;
height: 36px;
}
}
.user {
width: 32px;
height: 32px;
margin-right: 11px;
img {
width: 100%;
height: 100%;
.icon {
width: 18px;
height: 18px;
margin-left: 9px;
margin-top: 9px;
img {
width: 100%;
height: 100%;
}
}
}
.name {
width: 48px;
height: 30px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-style: Regular;
font-size: 16px;
font-weight: 400;
line-height: 30px;
letter-spacing: 0px;
.info-box {
height: 64px;
display: flex;
justify-content: flex-end;
align-items: center;
.mail {
width: 32px;
height: 32px;
margin-right: 14px;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.user {
width: 32px;
height: 32px;
margin-right: 11px;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.name {
width: 48px;
height: 30px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-style: Regular;
font-size: 16px;
font-weight: 400;
line-height: 30px;
letter-spacing: 0px;
}
}
}
}
......@@ -508,6 +528,7 @@ body {
border: 1px solid rgba(255, 255, 255, 1);
border-radius: 10px;
backdrop-filter: blur(30px);
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 0.8);
.menu-content {
width: 562px;
......@@ -717,6 +738,7 @@ body {
.tool-item {
width: 24px;
height: 24px;
cursor: pointer;
img {
width: 100%;
height: 100%;
......
......@@ -37,7 +37,7 @@
<div class="title">{{ "最新动态" }}</div>
</div>
<div class="box1-main">
<div class="box1-item" v-for="(item, index) in box1DataList" :key="index">
<div class="box1-item" v-for="(item, index) in box1DataList" :key="index" @click="handleToDecreeDetail(item)">
<div class="box1-item-left">{{ index + 1 }}</div>
<div class="box1-item-right">
<div class="title">{{ item.name }}</div>
......@@ -162,7 +162,7 @@
<div class="text">{{ item.name }}</div>
</div>
</div>
<div class="left-footer" v-if="box3DataList.length">
<div class="left-footer">
<el-pagination
background
layout="prev, pager, next"
......@@ -217,6 +217,7 @@
<script setup>
import { onMounted, ref, computed, inject, watch, onUnmounted } from "vue";
import router from "@/router";
import setChart from "@/utils/setChart";
import getWordCloudChart from "./uitls/worldCloudChart";
import {
......@@ -497,6 +498,17 @@ const prev = () => {
}
};
const handleToDecreeDetail = (item) => {
window.sessionStorage.setItem("curTabName", item.title);
const route = router.resolve({
path: "/decreeLayout",
query: {
id: item.id
}
});
window.open(route.href, "_blank");
}
watch(activeDate, async () => {
handleGetBox2DataList(); // 美对我要素打压情况
handleGetBox3DataList(); // 美自身要素发展情况
......@@ -692,6 +704,7 @@ onUnmounted(() => {
margin: 0 auto;
display: flex;
cursor: pointer;
.box1-item-left {
width: 30px;
height: 30px;
......
No preview for this file type
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论