-
+
-
+
-
-
+
+
-
+
{{ item.frequency }}Hz
-
+
@@ -706,6 +433,7 @@ export default {
coolingTowerInlet: [], //冷却塔进水阀
coolingTowerOutlet: [], //冷却塔出水阀
freezingManifold: [], //冷冻总管
+ calorimeter: [], //机房热量计
isShowOn: false, //一键启停,false是Off,true显示On
oneKeyButtonId: "",
@@ -738,6 +466,9 @@ export default {
// 冷却进出水温度
coolingInTem: "",
coolingOutTem: "",
+ // 机房瞬时流量和瞬时热量
+ roomFlow: "",
+ roomHeat: "",
// 报警标志
isWarning: false,
@@ -759,7 +490,7 @@ export default {
hostReduceTime: "", //主机减载时间
};
},
- created() {},
+ created() { },
mounted() {
// 首次进入页面时执行
this.getWeatherData();
@@ -925,7 +656,7 @@ export default {
this.ggetOneKeyButton();
});
})
- .catch(() => {});
+ .catch(() => { });
},
// 主机加减载时间min
getPolicyList() {
@@ -1020,6 +751,11 @@ export default {
console.log("冷冻总管", this.freezingManifold);
this.freezingManifoldData();
break;
+ case "25":
+ this.calorimeter = row.values;
+ console.log("机房总热量计", this.calorimeter);
+ this.calorimeterData();
+ break;
default:
break;
}
@@ -1057,7 +793,7 @@ export default {
return false;
}
// 检查 properties 数组是否存在 hostList[index]数组的properties数组
- const properties = this.hostList[index-1].properties;
+ const properties = this.hostList[index - 1].properties;
if (!properties || properties.length === 0) {
return false;
}
@@ -1698,6 +1434,23 @@ export default {
});
return true;
},
+ // 机房热量计数据
+ calorimeterData(index, item) {
+ // console.log("this.calorimeter", this.calorimeter);
+ // 检查 freezingManifold 长度是否足够
+ if (this.calorimeter.length <= index) {
+ return false;
+ }
+ this.calorimeter.forEach((item) => {
+ if (item.collectName === "冷却水_瞬时流量") {
+ this.roomFlow = item.collectValue;
+ console.log("item.collectName", item.collectName);
+ } else if (item.collectName === "冷却水_瞬时热量") {
+ this.roomHeat = item.collectValue;
+ }
+ });
+ return true;
+ },
// 风机控制 index代表冷却塔几，val代表风机几
goControlFanList(itemArr, index, val) {
console.log("itemArr", itemArr, index, val);
@@ -1953,8 +1706,7 @@ export default {
//手动控制
handleControlText(item) {
this.$confirm(
- `确定要切换设备"${item.name}"的状态为:${
- item.controlText ? "开启" : "停止 吗?"
+ `确定要切换设备"${item.name}"的状态为:${item.controlText ? "开启" : "停止 吗?"
}`,
"提示",
{
@@ -1983,8 +1735,7 @@ export default {
// 手自动切换
handleAutomaticText(item) {
this.$confirm(
- `确定要切换设备"${item.name}"的状态为:${
- item.automaticText ? "手动" : "自动 吗?"
+ `确定要切换设备"${item.name}"的状态为:${item.automaticText ? "手动" : "自动 吗?"
}`,
"提示",
{
@@ -2013,8 +1764,7 @@ export default {
// 频率-手自动切换
handleFrequencyAutomaticText(item) {
this.$confirm(
- `确定要切换"${item.name}"的频率手自动状态为:${
- item.frequencyAutotext ? "手动" : "自动 吗?"
+ `确定要切换"${item.name}"的频率手自动状态为:${item.frequencyAutotext ? "手动" : "自动 吗?"
}`,
"提示",
{
@@ -2082,11 +1832,13 @@ export default {
height: auto;
background-color: black;
color: #fff;
+
.monitor-content {
width: 16rem;
min-height: calc(10.74rem - 1rem);
position: relative;
margin-left: calc((100% - 16rem) / 2);
+
.monitor-img {
position: absolute;
top: 0.2rem;
@@ -2096,6 +1848,7 @@ export default {
height: 9.25rem;
z-index: 1;
}
+
.fan-img1 {
z-index: 10;
position: absolute;
@@ -2106,6 +1859,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
.fan-img2 {
z-index: 10;
position: absolute;
@@ -2116,6 +1870,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
.fan-img3 {
z-index: 10;
position: absolute;
@@ -2126,6 +1881,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
.fan-img4 {
z-index: 10;
position: absolute;
@@ -2136,6 +1892,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
.fan-img5 {
z-index: 10;
position: absolute;
@@ -2146,17 +1903,20 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
/* 定义 fan 动画关键帧 */
@keyframes fan {
0% {
/* 修改初始旋转角度 */
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
100% {
/* 修改结束旋转角度 */
transform: translateX(-50%) rotateX(60deg) rotateZ(360deg);
}
}
+
.towerValve1 {
z-index: 10;
position: absolute;
@@ -2167,6 +1927,7 @@ export default {
background-color: #ebebeb;
border-radius: 50%;
}
+
.towerValve2 {
z-index: 10;
position: absolute;
@@ -2177,6 +1938,7 @@ export default {
background-color: #ebebeb;
border-radius: 50%;
}
+
.towerValve3 {
z-index: 10;
position: absolute;
@@ -2187,6 +1949,7 @@ export default {
background-color: #ebebeb;
border-radius: 50%;
}
+
.in-arrow {
position: absolute;
top: 2.9rem;
@@ -2196,6 +1959,7 @@ export default {
height: 0.6rem;
z-index: 10;
}
+
.out-arrow {
position: absolute;
top: 3.7rem;
@@ -2204,6 +1968,7 @@ export default {
height: 0.6rem;
z-index: 10;
}
+
.coolingInTem {
z-index: 10;
position: absolute;
@@ -2212,6 +1977,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.coolingOutTem {
z-index: 10;
position: absolute;
@@ -2220,6 +1986,23 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+ .roomFlow {
+ z-index: 10;
+ position: absolute;
+ top: 3.5rem;
+ left: 3.3rem;
+ font-size: 0.16rem;
+ font-weight: bold;
+ }
+ .roomHeat {
+ z-index: 10;
+ position: absolute;
+ top: 3.9rem;
+ left: 3.3rem;
+ font-size: 0.16rem;
+ font-weight: bold;
+ }
+
.freezingInTem {
z-index: 10;
position: absolute;
@@ -2228,6 +2011,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.freezingOutTem {
z-index: 10;
position: absolute;
@@ -2236,6 +2020,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.freezingOutWater {
z-index: 10;
position: absolute;
@@ -2253,6 +2038,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.freezingOutPre {
z-index: 10;
position: absolute;
@@ -2261,24 +2047,28 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.host-line1 {
position: absolute;
left: -0.2rem;
top: 7.04rem;
z-index: 10;
}
+
.host-line2 {
position: absolute;
left: -0.25rem;
top: 7.72rem;
z-index: 10;
}
+
.host-line3 {
position: absolute;
left: 0.3rem;
top: 8.4rem;
z-index: 10;
}
+
.hostName1 {
cursor: pointer;
border-bottom: 1px solid rgba(0, 255, 255, 1);
@@ -2289,10 +2079,14 @@ export default {
position: absolute;
top: 6.95rem;
left: 2.85rem;
- transform: rotateX(50deg) rotateY(0deg) rotateZ(45deg); /* 分别在 X、Y、Z 轴上旋转 */
- transform-origin: bottom center; /* 设置旋转的基点为底部中心 */
- text-shadow: 0.02rem 0.02rem 0.04rem rgba(0, 0, 0, 0.9); /* 添加文字阴影增强立体感 */
+ transform: rotateX(50deg) rotateY(0deg) rotateZ(45deg);
+ /* 分别在 X、Y、Z 轴上旋转 */
+ transform-origin: bottom center;
+ /* 设置旋转的基点为底部中心 */
+ text-shadow: 0.02rem 0.02rem 0.04rem rgba(0, 0, 0, 0.9);
+ /* 添加文字阴影增强立体感 */
}
+
.hostName2 {
cursor: pointer;
border-bottom: 1px solid rgba(0, 255, 255, 1);
@@ -2307,6 +2101,7 @@ export default {
transform-origin: bottom center;
text-shadow: 0.02rem 0.02rem 0.04rem rgba(0, 0, 0, 0.9);
}
+
.hostName3 {
cursor: pointer;
border-bottom: 1px solid rgba(0, 255, 255, 1);
@@ -2321,17 +2116,20 @@ export default {
transform-origin: bottom center;
text-shadow: 0.02rem 0.02rem 0.04rem rgba(0, 0, 0, 0.9);
}
+
/* 定义 host 动画关键帧 */
@keyframes host {
0% {
/* 修改初始旋转角度 */
transform: translateX(-50%) rotateX(15deg) rotateZ(0deg);
}
+
100% {
/* 修改结束旋转角度 */
transform: translateX(-50%) rotateX(15deg) rotateZ(360deg);
}
}
+
.host-img1 {
z-index: 10;
position: absolute;
@@ -2342,6 +2140,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateY(0deg) rotateX(0deg) rotateZ(0deg);
}
+
.host-img2 {
z-index: 10;
position: absolute;
@@ -2352,6 +2151,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(0deg) rotateZ(0deg);
}
+
.host-img3 {
z-index: 10;
position: absolute;
@@ -2362,6 +2162,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(15deg) rotateZ(0deg);
}
+
.host-main1 {
z-index: 100;
position: absolute;
@@ -2375,6 +2176,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateY(0deg) rotateX(0deg) rotateZ(30deg);
}
+
.host-main2 {
z-index: 100;
position: absolute;
@@ -2388,6 +2190,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateY(0deg) rotateX(0deg) rotateZ(30deg);
}
+
.host-main3 {
z-index: 100;
position: absolute;
@@ -2401,6 +2204,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateY(0deg) rotateX(0deg) rotateZ(30deg);
}
+
.hostLoad1 {
z-index: 10;
position: absolute;
@@ -2409,6 +2213,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.hostLoad2 {
z-index: 10;
position: absolute;
@@ -2417,6 +2222,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.hostLoad3 {
z-index: 10;
position: absolute;
@@ -2425,6 +2231,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.water-flow1 {
z-index: 10;
position: absolute;
@@ -2432,6 +2239,7 @@ export default {
left: 0.75rem;
font-size: 0.16rem;
}
+
.water-flow2 {
z-index: 10;
position: absolute;
@@ -2439,6 +2247,7 @@ export default {
left: 1rem;
font-size: 0.16rem;
}
+
.water-flow3 {
z-index: 10;
position: absolute;
@@ -2446,17 +2255,20 @@ export default {
left: 1.52rem;
font-size: 0.16rem;
}
+
.water-flow-li {
margin-bottom: 0.04rem;
color: #46f1e3;
display: flex;
flex-direction: row;
align-items: center;
+
span {
background-color: rgba(0, 255, 255, 0.2);
border-radius: 0.1rem;
padding: 0.01rem 0.03rem;
}
+
.break {
margin-left: 0.07rem;
display: inline-block;
@@ -2466,22 +2278,27 @@ export default {
border: 1px solid #46f1e3;
background-color: transparent !important;
}
+
.connect {
animation: blink 1s infinite;
background-color: #38fc52 !important;
}
}
+
.moveClass {
animation: host 2s linear infinite;
}
+
.moveClass2 {
animation: fan 2s linear infinite;
}
+
.startClass {
/* 应用动画 */
animation: blink 1s infinite;
background-color: #38fc52 !important;
}
+
.hostStatus1 {
z-index: 10;
position: absolute;
@@ -2491,6 +2308,7 @@ export default {
height: 0.18rem;
border-radius: 50%;
}
+
.hostStatus2 {
z-index: 10;
position: absolute;
@@ -2500,6 +2318,7 @@ export default {
height: 0.18rem;
border-radius: 50%;
}
+
.hostStatus3 {
z-index: 10;
position: absolute;
@@ -2509,6 +2328,7 @@ export default {
height: 0.18rem;
border-radius: 50%;
}
+
.coolingPump1 {
cursor: pointer;
z-index: 10;
@@ -2519,6 +2339,7 @@ export default {
top: 4.07rem;
left: 7.57rem;
}
+
.coolingPump2 {
cursor: pointer;
z-index: 10;
@@ -2529,6 +2350,7 @@ export default {
top: 3.67rem;
left: 8.5rem;
}
+
.coolingPump3 {
cursor: pointer;
z-index: 10;
@@ -2539,6 +2361,7 @@ export default {
top: 3.34rem;
left: 9.4rem;
}
+
.cooling-img1 {
z-index: 10;
position: absolute;
@@ -2549,6 +2372,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
.cooling-img2 {
z-index: 10;
position: absolute;
@@ -2559,6 +2383,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
.cooling-img3 {
z-index: 10;
position: absolute;
@@ -2569,6 +2394,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
.cooling-hz1 {
z-index: 10;
position: absolute;
@@ -2577,6 +2403,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.cooling-hz2 {
z-index: 10;
position: absolute;
@@ -2585,6 +2412,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.cooling-hz3 {
z-index: 10;
position: absolute;
@@ -2593,6 +2421,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.freezingPump1 {
cursor: pointer;
z-index: 10;
@@ -2603,6 +2432,7 @@ export default {
top: 7.56rem;
left: 7.11rem;
}
+
.freezingPump2 {
cursor: pointer;
z-index: 10;
@@ -2613,6 +2443,7 @@ export default {
top: 6.89rem;
left: 8.43rem;
}
+
.freezingPump3 {
cursor: pointer;
z-index: 10;
@@ -2623,6 +2454,7 @@ export default {
top: 6.38rem;
left: 9.5rem;
}
+
.freezing-img1 {
z-index: 10;
position: absolute;
@@ -2633,6 +2465,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
.freezing-img2 {
z-index: 10;
position: absolute;
@@ -2643,6 +2476,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
.freezing-img3 {
z-index: 10;
position: absolute;
@@ -2653,6 +2487,7 @@ export default {
transform-style: preserve-3d;
transform: translateX(-50%) rotateX(60deg) rotateZ(0deg);
}
+
.freezing-hz1 {
z-index: 10;
position: absolute;
@@ -2661,6 +2496,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.freezing-hz2 {
z-index: 10;
position: absolute;
@@ -2669,6 +2505,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.freezing-hz3 {
z-index: 10;
position: absolute;
@@ -2677,6 +2514,7 @@ export default {
font-size: 0.16rem;
font-weight: bold;
}
+
.coolingTower3 {
cursor: pointer;
z-index: 10;
@@ -2688,6 +2526,7 @@ export default {
font-weight: bold;
transform: rotateX(20deg) rotateY(-25deg) rotateZ(-5deg);
}
+
.coolingTower22 {
cursor: pointer;
z-index: 10;
@@ -2699,6 +2538,7 @@ export default {
font-weight: bold;
transform: rotateX(20deg) rotateY(-25deg) rotateZ(-5deg);
}
+
.coolingTower21 {
cursor: pointer;
z-index: 10;
@@ -2710,6 +2550,7 @@ export default {
font-weight: bold;
transform: rotateX(20deg) rotateY(-25deg) rotateZ(-5deg);
}
+
.coolingTower12 {
cursor: pointer;
z-index: 10;
@@ -2721,6 +2562,7 @@ export default {
font-weight: bold;
transform: rotateX(20deg) rotateY(-25deg) rotateZ(-5deg);
}
+
.coolingTower11 {
cursor: pointer;
z-index: 10;
@@ -2732,6 +2574,7 @@ export default {
font-weight: bold;
transform: rotateX(20deg) rotateY(-25deg) rotateZ(-5deg);
}
+
.coolingTowerHz11 {
z-index: 10;
font-size: 0.16rem;
@@ -2742,6 +2585,7 @@ export default {
font-weight: bold;
transform: rotateX(20deg) rotateY(-25deg) rotateZ(-5deg);
}
+
.coolingTowerHz12 {
z-index: 10;
font-size: 0.16rem;
@@ -2752,6 +2596,7 @@ export default {
font-weight: bold;
transform: rotateX(20deg) rotateY(-25deg) rotateZ(-5deg);
}
+
.coolingTowerHz21 {
z-index: 10;
font-size: 0.16rem;
@@ -2762,6 +2607,7 @@ export default {
font-weight: bold;
transform: rotateX(20deg) rotateY(-25deg) rotateZ(-5deg);
}
+
.coolingTowerHz22 {
z-index: 10;
font-size: 0.16rem;
@@ -2772,6 +2618,7 @@ export default {
font-weight: bold;
transform: rotateX(20deg) rotateY(-25deg) rotateZ(-5deg);
}
+
.coolingTowerHz3 {
z-index: 10;
font-size: 0.16rem;
@@ -2782,18 +2629,22 @@ export default {
font-weight: bold;
transform: rotateX(20deg) rotateY(-25deg) rotateZ(-5deg);
}
+
/* 定义灯闪烁的动画 */
@keyframes blink {
0% {
opacity: 1;
}
+
50% {
opacity: 0.7;
}
+
100% {
opacity: 1;
}
}
+
.frozenValve1 {
cursor: pointer;
z-index: 10;
@@ -2805,6 +2656,7 @@ export default {
background-color: #ebebeb;
border-radius: 50%;
}
+
.frozenValve2 {
cursor: pointer;
z-index: 10;
@@ -2816,6 +2668,7 @@ export default {
background-color: #ebebeb;
border-radius: 50%;
}
+
.frozenValve3 {
cursor: pointer;
z-index: 10;
@@ -2827,6 +2680,7 @@ export default {
background-color: #ebebeb;
border-radius: 50%;
}
+
.coolingValue1 {
cursor: pointer;
z-index: 10;
@@ -2838,6 +2692,7 @@ export default {
background-color: #ebebeb;
border-radius: 50%;
}
+
.coolingValue2 {
cursor: pointer;
z-index: 10;
@@ -2849,6 +2704,7 @@ export default {
background-color: #ebebeb;
border-radius: 50%;
}
+
.coolingValue3 {
cursor: pointer;
z-index: 10;
@@ -2860,12 +2716,14 @@ export default {
background-color: #ebebeb;
border-radius: 50%;
}
+
.statusAndModel {
z-index: 10;
position: absolute;
top: 8.6rem;
right: 2.3rem;
width: 3rem;
+
.warnStatus {
position: absolute;
left: 0.04rem;
@@ -2874,20 +2732,24 @@ export default {
height: 0.45rem;
animation: breathe 4s ease-in-out infinite;
}
+
@keyframes breathe {
0% {
transform: scale(1);
opacity: 0.5;
}
+
50% {
transform: scale(1.1);
opacity: 1;
}
+
100% {
transform: scale(1);
opacity: 0.5;
}
}
+
.modelStatus {
position: absolute;
top: 0;
@@ -2895,6 +2757,7 @@ export default {
width: 2.65rem;
height: 0.83rem;
}
+
.sysNormal {
position: absolute;
top: 0.63rem;
@@ -2904,6 +2767,7 @@ export default {
color: #89e8f5;
letter-spacing: 0.02rem;
}
+
.sysWarning {
position: absolute;
top: 0.63rem;
@@ -2915,6 +2779,7 @@ export default {
letter-spacing: 0.02rem;
animation: blink 0.5s ease-in-out infinite;
}
+
.sysStatus {
position: absolute;
top: 0.2rem;
@@ -2926,6 +2791,7 @@ export default {
}
}
}
+
.weather {
min-width: 2.85rem;
z-index: 10;
@@ -2945,6 +2811,7 @@ export default {
background-repeat: no-repeat;
padding: 0.15rem 0.1rem 0.25rem 0rem;
}
+
.weather-li {
width: 100%;
padding: 0.05rem 0 0.05rem 0.3rem;
@@ -2952,6 +2819,7 @@ export default {
border-top: 1px solid transparent;
border-bottom: 1px dashed #1a3f8f;
position: relative;
+
.deepColor {
display: inline-block;
margin: 0 0.1rem 0 0.05rem;
@@ -2975,6 +2843,7 @@ export default {
justify-content: flex-start;
font-size: 0.16rem;
}
+
.perdformance-bg {
width: 2.85rem;
z-index: 10;
@@ -2989,6 +2858,7 @@ export default {
background-repeat: no-repeat;
padding: 0.15rem 0.1rem 0.25rem 0rem;
}
+
.title {
z-index: 10;
width: 100%;
@@ -3007,6 +2877,7 @@ export default {
margin-bottom: 0.01rem;
margin-left: 0.4rem;
}
+
.offClass {
position: absolute;
width: 1.6rem;
@@ -3022,6 +2893,7 @@ export default {
align-items: center;
justify-content: center;
cursor: pointer;
+
.off-bg {
position: absolute;
left: 0.38rem;
@@ -3038,28 +2910,39 @@ export default {
color: #6cf02f;
font-weight: bold;
}
+
.on-animation {
animation: rotateZ 5s linear infinite;
- transition: 0.6s; /* 设置过渡时间，控制翻转速度 */
- transform-style: preserve-3d; /* 保持子元素的 3D 效果 */
+ transition: 0.6s;
+ /* 设置过渡时间，控制翻转速度 */
+ transform-style: preserve-3d;
+ /* 保持子元素的 3D 效果 */
}
+
/* 定义旋转动画 */
@keyframes rotateZ {
0% {
- transform: rotateY(0deg); /* 初始状态，不旋转 */
+ transform: rotateY(0deg);
+ /* 初始状态，不旋转 */
}
+
50% {
- transform: rotateY(180deg); /* 旋转到 180 度，呈现翻面效果 */
+ transform: rotateY(180deg);
+ /* 旋转到 180 度，呈现翻面效果 */
}
+
100% {
- transform: rotateY(360deg); /* 旋转回 360 度，回到初始状态 */
+ transform: rotateY(360deg);
+ /* 旋转回 360 度，回到初始状态 */
}
}
}
+
/* 鼠标悬停时移除动画 */
.offClass:hover .on-animation {
animation: none;
}
+
.sysTips {
position: absolute;
top: 2.2rem;
@@ -3068,20 +2951,26 @@ export default {
flex-direction: row;
align-items: center;
z-index: 10;
+
.step {
width: 0.2rem;
height: 0.3rem;
margin-right: 0.04rem;
animation: moveRight 1s ease-in-out infinite alternate;
}
+
@keyframes moveRight {
0% {
- transform: translateX(0); /* 初始位置，不移动 */
+ transform: translateX(0);
+ /* 初始位置，不移动 */
}
+
100% {
- transform: translateX(0.04rem); /* 向右移动 1rem 的距离 */
+ transform: translateX(0.04rem);
+ /* 向右移动 1rem 的距离 */
}
}
+
.tips-text {
border: 0.01rem solid transparent;
border-image: linear-gradient(to right, #007bff, #00ffff);
@@ -3091,6 +2980,7 @@ export default {
padding: 0.01rem 0.03rem;
}
}
+
.funtion-menu1 {
position: absolute;
top: 7.2rem;
@@ -3102,12 +2992,14 @@ export default {
width: 1.7rem;
height: 0.8rem;
cursor: pointer;
+
.ditu {
width: 1.7rem;
height: 0.8rem;
position: absolute;
top: 0;
}
+
.menu-title {
color: #46f1e3;
font-size: 0.18rem;
@@ -3117,6 +3009,7 @@ export default {
top: 0;
left: 0.2rem;
width: 1.25rem;
+
div {
position: relative;
text-align: center;
@@ -3124,6 +3017,7 @@ export default {
transition: all 0.3s;
padding: 0.01rem 0.02rem;
background-color: rgba(0, 255, 255, 0.2);
+
&::before,
&::after {
content: "";
@@ -3137,20 +3031,26 @@ export default {
border-radius: var(--bRadius);
animation: clippath 3s infinite linear;
}
+
&::after {
animation: clippath 3s infinite -1.5s linear;
}
+
@keyframes clippath {
+
0%,
100% {
clip-path: inset(0 0 98% 0);
}
+
25% {
clip-path: inset(0 98% 0 0);
}
+
50% {
clip-path: inset(98% 0 0 0);
}
+
75% {
clip-path: inset(0 0 0 98%);
}
@@ -3158,23 +3058,27 @@ export default {
}
}
}
+
.menu2 {
position: absolute;
top: 8.6rem;
left: -1.4rem;
}
+
.funtion-menu1:hover {
.menu-title {
transform: scale(1.1);
}
}
}
+
.detail-data-bottom {
width: 3.5rem;
position: absolute;
top: 0.5rem;
right: 2.5rem;
}
+
// @media (min-width: 1240px) and (max-width: 1440px) {
// }
@media (max-width: 1440px) {
@@ -3184,7 +3088,7 @@ export default {
}
diff --git a/src/views/hotWater/profitAnalysis/index.vue b/src/views/hotWater/profitAnalysis/index.vue
index abf6d88..79ac98d 100644
--- a/src/views/hotWater/profitAnalysis/index.vue
+++ b/src/views/hotWater/profitAnalysis/index.vue
@@ -831,7 +831,7 @@ export default {
padding: [4, 8],
borderRadius: 4,
backgroundColor: 'rgba(0, 0, 0, 0.7)',
- offset: [0, -30]
+ offset: [0, -25]
},
itemStyle: {
color: "#10b981",
+ 
-
+
+ 
- 
+ 
- 
+ 
- 
+