From b72618fe9cfc46e7de0e38f51ba2440b86f08794 Mon Sep 17 00:00:00 2001
From: whyczyk <525500596@qq.com>
Date: 星期一, 26 七月 2021 17:17:31 +0800
Subject: [PATCH] 首页拓扑图修改
---
src/components/PageHeader.vue | 59 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 56 insertions(+), 3 deletions(-)
diff --git a/src/components/PageHeader.vue b/src/components/PageHeader.vue
index 5a7eda6..452ca4b 100644
--- a/src/components/PageHeader.vue
+++ b/src/components/PageHeader.vue
@@ -1,6 +1,10 @@
<template>
<div class="pageHeader">
<div class="headTitle">FMDS | 鐢垫満璇曢獙闆嗕腑娴嬫帶骞冲彴</div>
+ <div class="headInfoCon">
+ <div class="info">缃戠粶鐘舵��:姝ｅ父</div>
+ <div class="scrollCon"><span v-html="notice"></span></div>
+ </div>
<div class="headToolsCon">
<div class="avatar">
<span class="avatar-icon">
@@ -43,6 +47,7 @@
pwd: {
show: false,
},
+ notice: '鐩存祦涓婚厤鐢垫煖A鎺掔數鍘嬭繃楂樻姤璀�'
}
},
methods: {
@@ -88,7 +93,18 @@
}
.headToolsCon {
- width: 100%;
+ height: 40px;
+ position: absolute;
+ right: 0;
+ bottom: 0;
+ z-index: 2;
+ display: flex;
+ align-items: center;
+ flex-direction: row-reverse;
+ padding-right: 40px;
+ }
+
+ .headInfoCon {
height: 40px;
position: absolute;
left: 0;
@@ -96,8 +112,45 @@
z-index: 2;
display: flex;
align-items: center;
- flex-direction: row-reverse;
- padding-right: 40px;
+ ;
+ padding-left: 40px;
+ }
+
+ .headInfoCon .info {
+ font-size: 16px;
+ display: flex;
+ align-items: center;
+ border-right: 1px solid #ffffff;
+ padding-right: 8px;
+ margin-right: 8px;
+ }
+
+ .headInfoCon .scrollCon {
+ font-size: 16px;
+ width: 290px;
+ overflow: hidden;
+ }
+
+ .headInfoCon .scrollCon>span {
+ display: block;
+ margin-left: 100%;
+ width: 290px;
+ animation: myMove 8s linear infinite;
+ animation-fill-mode: forwards;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ /*鏂囧瓧鏃犵紳婊氬姩*/
+ @keyframes myMove {
+ 0% {
+ transform: translateX(0);
+ }
+
+ 100% {
+ transform: translateX(-580px);
+ }
}
.avatar {
--
Gitblit v1.9.1