From 12880523c9cf1a31d62493074c9dca1270a6778a Mon Sep 17 00:00:00 2001
From: "452061493@qq.com" <452061493@qq.com>
Date: Sat, 13 Apr 2024 11:23:27 +0800
Subject: [PATCH] =?UTF-8?q?=E6=89=A7=E6=B3=95=E7=AB=AF=E9=A6=96=E9=A1=B5?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=A8=AA=E5=B9=85=E9=80=9A=E7=9F=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/enforce/enforceNotice.vue |  2 +-
 src/views/enforceHome.vue           | 49 ++++++++++++++++++++++++-----
 2 files changed, 42 insertions(+), 9 deletions(-)

diff --git a/src/views/enforce/enforceNotice.vue b/src/views/enforce/enforceNotice.vue
index 958d8cb..cb80cda 100644
--- a/src/views/enforce/enforceNotice.vue
+++ b/src/views/enforce/enforceNotice.vue
@@ -379,7 +379,7 @@ const searchComplaint = (val) =>{
   height: 0.75rem;
   font-size: 0.4rem;
   font-weight: 600;
-  line-height: 1rem;
+  line-height: 0.75rem;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
diff --git a/src/views/enforceHome.vue b/src/views/enforceHome.vue
index 31c0dd1..4c246e0 100644
--- a/src/views/enforceHome.vue
+++ b/src/views/enforceHome.vue
@@ -8,6 +8,7 @@
 		<!-- 中间 -->
 		<div class="warp_body">
       <div class="logobox"></div>
+      <div class="streamer" @click=""><i></i><span class="marquee"><span class="scroll-text">2024年度宝安区新安街道年度行政执法检查计划</span></span></div>
       <div class="noticbox" @click="toNoticeView"><i></i><span class="new"></span>通知</div>
 			<!-- <refresh-list v-model:freshMap="freshMap" @refresh="onRefresh" @onLoad="onLoad"> -->
 				<div class="carousel_box" @onLoad="onLoad">
@@ -217,26 +218,40 @@ onMounted(() => {
 	}
 }
 
-.noticbox  {
+
+.streamer, .noticbox {
+  display: flex;
   position: absolute;
-  top: 20%;
-  right: 0;
+  top: calc(1% + 10vh);
+  right: 3%;
   z-index: 999;
   padding: 0 0.25rem;
-  min-width: 1rem;
+  width: 90%;
   min-height: 1rem;
-  background-color: rgba(249, 238, 219, .7);
-  border-radius: 0.5rem 0 0 0.5rem;
+  background-color: rgba(249, 238, 219, .9);
+  border-radius: 0.5rem;
   color: #ab6a05;
   font-size: 0.45rem;
   line-height: 1.0rem;
   white-space: nowrap;
+  box-sizing: content-box;
+}
+
+.noticbox {
+  top: 42%;
+  right: 0;
+  padding: 0 0.2rem;
+  width: 1.85rem;
+  min-height: 1rem;
+  background-color: rgba(249, 238, 219, .7);
+  border-radius: 0.5rem 0 0 0.5rem;
+  color: #000;
 }
 
-.noticbox > i {
+.streamer > i, .noticbox > i {
   display: inline-block;
   position: relative;
-  top: 0.12rem;
+  top: 0.18rem;
   margin: 0 0.3rem 0 0;
   width: 0.6rem;
   height: 0.6rem;
@@ -244,6 +259,24 @@ onMounted(() => {
   background-size: auto 100%;
 }
 
+.streamer .marquee {
+  display: inline-block;
+  width: calc(100% - 1rem); /* 或者你想要的宽度 */
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.scroll-text {
+  display: inline-block;
+  padding-left: 100%; /* 初始时隐藏在右侧 */
+  animation: marquee 5s linear infinite; /* 设置动画 */
+}
+
+@keyframes marquee {
+  0% { transform: translateX(0); } /* 动画开始时 */
+  100% { transform: translateX(-100%); } /* 动画结束时，文字完全移动到左侧并重新开始 */
+}
+
 .noticbox span.new {
   display: block;
   position: absolute;