|
@@ -0,0 +1,142 @@
|
|
|
+<template>
|
|
|
+ <div style="height:calc(100vh);width:100%;background: #000">
|
|
|
+ <div class="page largeScreeanHomePage">
|
|
|
+ <div class="timeBox">{{ time }}</div>
|
|
|
+ <div class="topTiltle">
|
|
|
+ <span class="title">风压系统</span>
|
|
|
+<!-- <img-->
|
|
|
+<!-- class="titleImg"-->
|
|
|
+<!-- referrerpolicy="no-referrer"-->
|
|
|
+<!-- src="../../assets/largeScreenImg/index/heilongjiangshengfengziyuangaikuang.png"-->
|
|
|
+<!-- />-->
|
|
|
+ </div>
|
|
|
+ <div class="btuGroup">
|
|
|
+ <div class="topBtu topRightBtu" @click="push()">
|
|
|
+ <span class="btuText">后台管理</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="myMain-container">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ name: "index",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ time:null
|
|
|
+ }
|
|
|
+ },
|
|
|
+ destroyed() {
|
|
|
+ clearInterval(this.timer)
|
|
|
+ this.timer = null
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.formatTime()
|
|
|
+ this.timer = setInterval(this.formatTime, 1000 * 60)
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ push() {
|
|
|
+ // this.$router.push({path: "/dataQuery/windTowerStatusInfo"})
|
|
|
+ },
|
|
|
+ /*时间格式化*/
|
|
|
+ formatTime() {
|
|
|
+ this.time = ''
|
|
|
+ let date = new Date()
|
|
|
+ let year = date.getFullYear(); // 年
|
|
|
+ let month = date.getMonth() + 1; // 月
|
|
|
+ let day = date.getDate();
|
|
|
+ let hour = date.getHours(); // 获取当前小时数(0-23)
|
|
|
+ let minutes = date.getMinutes();
|
|
|
+ if (month < 10) month = "0" + month;
|
|
|
+ if (day < 10) day = "0" + day;
|
|
|
+ if (minutes < 10) minutes = "0" + minutes;
|
|
|
+ this.time = year + "-" + month + "-" + day + " " + hour + ' : ' + minutes;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.largeScreeanHomePage {
|
|
|
+ width: 100%;
|
|
|
+ height: calc(100vh);
|
|
|
+ background: url(../../../public/img/bg.png) -3px -1px no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+.topTiltle {
|
|
|
+ width: 100%;
|
|
|
+ height: 5.5%;
|
|
|
+ background: url(../../assets/largeScreenImg/index/topTitleBg.png) -2px -1px no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+.title {
|
|
|
+ width: 17%;
|
|
|
+ height: 100%;
|
|
|
+ text-align: center;
|
|
|
+ margin-top: .2%;
|
|
|
+ font-size: 30px;
|
|
|
+ font-weight: 800;
|
|
|
+ background-image: linear-gradient(
|
|
|
+ 360deg,
|
|
|
+ rgba(178, 204, 252, 1) 0,
|
|
|
+ rgba(178, 204, 252, 1) 0,
|
|
|
+ rgba(255, 255, 255, 1) 100%,
|
|
|
+ rgba(255, 255, 255, 1) 100%
|
|
|
+ );
|
|
|
+ background-clip: text;
|
|
|
+ color: transparent;
|
|
|
+}
|
|
|
+.timeBox {
|
|
|
+ position: absolute;
|
|
|
+ left: 2%;
|
|
|
+ top: 0;
|
|
|
+ font-size: 20px;
|
|
|
+ line-height: 40px;
|
|
|
+ font-family: timeFont !important;
|
|
|
+}
|
|
|
+
|
|
|
+.page {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ right: 0;
|
|
|
+ overflow: auto;
|
|
|
+ box-shadow: inset 0px -20px 550px 200px rgb(50, 93, 246, 0.1);
|
|
|
+}
|
|
|
+
|
|
|
+.btuGroup {
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ color: white;
|
|
|
+ width: 10%;
|
|
|
+ height: 5.5%;
|
|
|
+ display: flex;
|
|
|
+ font-size: 18px;
|
|
|
+}
|
|
|
+
|
|
|
+.topBtu {
|
|
|
+ height: 100%;
|
|
|
+ margin-top: -1.5%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.topRightBtu {
|
|
|
+ background: url(../../assets/largeScreenImg/index/topRightBtuBg.png) 100% no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+</style>
|