From 44920f344fbebaccf84a8e9f9607738e39da5bd4 Mon Sep 17 00:00:00 2001
From: 龚焕茏 <2842157468@qq.com>
Date: 星期三, 07 八月 2024 15:38:33 +0800
Subject: [PATCH] feat：考核预警
---
src/views/screen/newPage/index.vue | 87 +++++++++++++++++++++++++++++++------------
1 files changed, 62 insertions(+), 25 deletions(-)
diff --git a/src/views/screen/newPage/index.vue b/src/views/screen/newPage/index.vue
index ddeb34a..a2a83e9 100644
--- a/src/views/screen/newPage/index.vue
+++ b/src/views/screen/newPage/index.vue
@@ -17,10 +17,10 @@
</div>
<div style="display: flex; justify-content: space-between">
<div class="left_box">
- <div class="titleCard" style="height: 90px ;width:450px ;">
+ <div class="titleCard" style="height: 90px; width: 450px">
<div>杩愮淮鑰冩牳澶у睆</div>
</div>
- <div class="card" style="height: 622px;">
+ <div class="card" style="height: 622px">
<div class="card_header"><div class="title">宸ュ崟鏁版嵁</div></div>
<div><ScreenData></ScreenData></div>
</div>
@@ -46,14 +46,14 @@
<div class="data-lable">璁惧鎬绘暟</div>
<div class="data-num type1">
<span v-roll>{{ 1123 }}</span
- ><i class="el-icon-bottom"></i>
+ ><i class="el-icon-top"></i>
</div>
</div>
<div class="data-info">
<div class="data-lable">璁惧姝ｅ父鏁�</div>
<div class="data-num type2">
<span v-roll>{{ 1123 }}</span
- ><i class="el-icon-bottom"></i>
+ ><i class="el-icon-top"></i>
</div>
</div>
<div class="data-info">
@@ -138,24 +138,33 @@
<div class="footer_card">
<div class="card_header">
<div class="title">浜鸿劯鑰冩牳鏁版嵁</div>
- <div style="width: 600px; margin-left: -20px;">
- <ExamineChart class="wrapper-item"></ExamineChart>
+ <div style="width: 600px; margin-left: -20px">
+ <ExamineChart class="wrapper-item" dataType="face"></ExamineChart>
</div>
</div>
</div>
<div class="footer_card">
<div class="card_header">
- <div class="title">杞﹁締鑰冩牳鏁版嵁</div>
- <div style="width: 600px;margin-left: -20px;">
- <ExamineChart class="wrapper-item"></ExamineChart>
+ <div class="titleCar">杞﹁締鑰冩牳鏁版嵁</div>
+ </div>
+ <div
+ style="
+ overflow: hidden;
+ overflow-x: auto;
+ margin-top: -9px;
+ height: 90%;
+ "
+ >
+ <div style="width: 750px">
+ <ExamineChart class="wrapper-item" dataType="car"></ExamineChart>
</div>
</div>
</div>
<div class="footer_card">
<div class="card_header">
<div class="title">瑙嗛鑰冩牳鏁版嵁</div>
- <div style="width: 600px;margin-left: -20px;">
- <ExamineChart class="wrapper-item"></ExamineChart>
+ <div style="width: 600px; margin-left: -20px">
+ <ExamineChart class="wrapper-item" dataType="video"></ExamineChart>
</div>
</div>
</div>
@@ -205,7 +214,9 @@
returnPath() {
this.$router.push("/index");
},
- handleClick() {},
+ handleClick(tab, event) {
+ console.log(tab, event);
+ },
},
};
</script>
@@ -221,29 +232,39 @@
}
.return-button {
position: absolute;
- right: 20px;
+ right: -5px;
top: 20px;
background: url("../../../assets/images/screen/backBt.png");
background-size: 100% 100%;
background-repeat: no-repeat !important;
background-position: center center !important;
- color: #4481dd;
padding: 15px 25px;
cursor: pointer;
+ font-size: 20px;
}
}
::v-deep .tabs-box {
margin-top: 5px;
.el-tabs__item {
color: #ffffff !important;
- font-size: 20px;
+ font-size: 26px;
}
.is-active {
- color: #66b5ff !important;
- background: url("../../../assets/images/screen/button1.png");
- background-size: cover !important;
- background-repeat: no-repeat !important;
- background-position: center center !important;
+ color: #00b8ff !important;
+ // background: url("../../../assets/images/screen/button1.png");
+ // background-size: cover !important;
+ // background-repeat: no-repeat !important;
+ // background-position: center center !important;
+ background: linear-gradient(#00b8ff, #00b8ff) left top,
+ linear-gradient(#00b8ff, #00b8ff) left top,
+ linear-gradient(#00b8ff, #00b8ff) right top,
+ linear-gradient(#00b8ff, #00b8ff) right top,
+ linear-gradient(#00b8ff, #00b8ff) left bottom,
+ linear-gradient(#00b8ff, #00b8ff) left bottom,
+ linear-gradient(#00b8ff, #00b8ff) right bottom,
+ linear-gradient(#00b8ff, #00b8ff) right bottom;
+ background-repeat: no-repeat;
+ background-size: 0.1vw 0.5vw, 0.5vw 0.1vw;
}
}
::v-deep .el-input__inner {
@@ -271,9 +292,17 @@
::v-deep .el-tabs__item {
margin: 5px 30px;
padding: 0px 25px !important;
- border-radius: 5px;
- border: 1px solid rgba(92, 148, 233, 0.4);
- background-color: rgba(65, 136, 242, 0.1);
+ background: linear-gradient(#ffffff, #ffffff) left top,
+ linear-gradient(#ffffff, #fff) left top,
+ linear-gradient(#ffffff, #ffffff) right top,
+ linear-gradient(#ffffff, #ffffff) right top,
+ linear-gradient(#ffffff, #ffffff) left bottom,
+ linear-gradient(#ffffff, #ffffff) left bottom,
+ linear-gradient(#ffffff, #ffffff) right bottom,
+ linear-gradient(#ffffff, #ffffff) right bottom;
+ background-repeat: no-repeat;
+ background-size: 0.1vw 0.5vw, 0.5vw 0.1vw;
+ // background-color: rgba(65, 136, 242, 0.1);
// background: url("../../../assets/images/screen/button.png");
// background-size: 100% 100%;
// background-repeat: no-repeat !important;
@@ -295,11 +324,11 @@
// background-size: 100% 100%;
// background-repeat: no-repeat !important;
// background-position: center center !important;
- font-size: 36px;
+ font-size: 40px;
font-weight: bold;
position: absolute;
top: -60px;
- left:0px;
+ left: 10px;
}
}
.large_screen_box {
@@ -335,6 +364,14 @@
margin: 5px 0;
.card_header {
height: 40px;
+ .titleCar {
+ margin-left: 20px;
+ padding-top: 5px;
+ color: #fff;
+ letter-spacing: 2px;
+ font-size: 20px;
+ font-style: italic;
+ }
}
}
}
--
Gitblit v1.8.0