From 18205dbe3091e701243fadeba8c063e149b729b2 Mon Sep 17 00:00:00 2001
From: whycq <whycq>
Date: 星期一, 18 四月 2022 10:34:32 +0800
Subject: [PATCH] #

---
 Monitor-APP/pages/index/index.vue |   51 +++++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 43 insertions(+), 8 deletions(-)

diff --git a/Monitor-APP/pages/index/index.vue b/Monitor-APP/pages/index/index.vue
index c51fe79..39f7882 100644
--- a/Monitor-APP/pages/index/index.vue
+++ b/Monitor-APP/pages/index/index.vue
@@ -1,6 +1,7 @@
 <template>
 	<view class="container">
-		<view class="curtain"></view>
+		<view class="upper " :class="mmm" ></view>
+		<view class="lower" :class="fff">
 			<view class="head">
 				<text>鑷姩浠撳簱WCS鐩戞帶骞冲彴</text>
 				<view class="time-tools">{{year}}-{{month}}-{{day}}&nbsp{{hours}}:{{minutes}}:{{seconds}}&nbsp{{week}}</view>
@@ -150,6 +151,7 @@
 					</view>
 				</view>
 			</view>
+		</view>
 			<view>
 				<!-- 杈撳叆url -->
 				<uni-popup ref="url" type="dialog">
@@ -208,6 +210,10 @@
 				minutes:38,
 				seconds:13,
 				week:'鏄熸湡鍥�',
+				ani:'',
+				move: 'upMove 1.5s 1;',
+				mmm:'upup',
+				fff:''
 			}
 		},
 		mounted() {
@@ -235,9 +241,22 @@
 			setInterval(() => {
 				this.getDate();
 			},1000)
-			
+			setInterval(() => {
+				this.animation();
+			},3000)
 		},
 		methods: {
+			animation() {
+				if (this.ani) {
+					this.ani = ''
+					this.mmm = 'upup'
+					this.fff = 'down'
+				} else {
+					this.ani = 1
+					this.mmm = 'down'
+					this.fff = 'upup'
+				}
+			},
 			getDateFormat(value) {
 				var date = new Date();// 鑾峰彇褰撳墠鏃堕棿
 				date.setDate(date.getDate() + value);// 璁剧疆澶╂暟 -1 澶�
@@ -349,16 +368,27 @@
 </script>
 
 <style>
-	.curtain {
+	/* animation:upMove 1.5s 1; */
+	/* downMove */
+	.upup {
+		animation: upMove 1.5s 1;
+		animation-fill-mode: both;
+	}
+	.down {
+		animation: downMove 1.5s 1;
+		animation-fill-mode: both;
+	}
+	.upper {
 		position: fixed;
 		width: 1920px;
 		height: 1080px;
+		/* top: -1000px; */
 		background-image: url(../../static/background.png);
 		/* background:red; */
-		animation:move 1.5s 1;
+		/* animation:upMove 1.5s 1; */
 		z-index: 999;
 	}
-	@keyframes mymove
+	@keyframes downMove
 		{
 		from {
 			opacity: 1;
@@ -368,14 +398,14 @@
 		to {
 			opacity: 0.5;
 			/* background-color:blue; */
-			top:-900px
+			top:-1080px
 		}
 	}
-	@keyframes move {
+	@keyframes upMove {
 		from {
 			opacity: 0.5;
 			/* background-color:blue; */
-			top:-900px
+			top:-1080px
 			}
 		to {
 			opacity: 1;
@@ -383,6 +413,11 @@
 			top: 0;
 		}
 	}
+	.lower {
+		width: 1920px;
+		height: 1080px;
+		position: relative;
+	}
 	.container {
 		width: 1920px;
 		height: 1080px;

--
Gitblit v1.9.1