Skip to content

Y
yindong-tongbai-automation
Commit b954628d authored by lei's avatar lei
Browse files
Options

样式微调

parent 7db1f784
Show whitespace changes
Inline Side-by-side
Showing with 265 additions and 334 deletions
src/views/Screen/items/hjjc.vue
View file @ b954628d
...@@ -162,9 +162,9 @@ ...@@ -162,9 +162,9 @@
<!-- 弹窗内容 --> <!-- 弹窗内容 -->
<transition name="el-fade-in"> <transition name="el-fade-in">
<div v-show="upWindowData.upWindowVisible" class="up-window"> <div v-show="upWindowData.upWindowVisible" class="up-window">
<p><span></span>四中温度设备一</p> <p><span></span>{{ upWindowData.title }}</p>
<i class="el-icon-close close-button" @click="closeUpWindow"></i> <i class="el-icon-close close-button" @click="closeUpWindow"></i>
<p class="date-title">2025-3-13</p> <p class="date-title">{{ upWindowData.date }}</p>
<div class="chart-box" id="chartBox"></div> <div class="chart-box" id="chartBox"></div>
</div> </div>
</transition> </transition>
...@@ -194,6 +194,8 @@ export default { ...@@ -194,6 +194,8 @@ export default {
upWindowData: { upWindowData: {
upWindowActive: "", upWindowActive: "",
upWindowVisible: false, upWindowVisible: false,
title: "",
date: "2025-03-19",
}, },
// 左边列表数据 // 左边列表数据
tableData1: [], tableData1: [],
...@@ -298,196 +300,6 @@ export default { ...@@ -298,196 +300,6 @@ export default {
}, },
], ],
}, },
{
isWarning: 0, //是否报警
x: 145,
y: 253,
name: "一中风机",
// 监测点
monitorPositionList: [
{
equipmentName: "一中避险硐室氧气", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
{
equipmentName: "一中避险硐室一氧化碳", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
],
},
{
isWarning: 0, //是否报警
x: 185,
y: 258,
name: "一中主运输港",
// 监测点
monitorPositionList: [
{
equipmentName: "一中避险硐室氧气", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
{
equipmentName: "一中避险硐室一氧化碳", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
],
},
{
isWarning: 0, //是否报警
x: 270,
y: 270,
name: "一中运输港",
// 监测点
monitorPositionList: [
{
equipmentName: "一中避险硐室氧气", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
{
equipmentName: "一中避险硐室一氧化碳", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
],
},
{
isWarning: 0, //是否报警
x: 237,
y: 280,
name: "一中西采区",
// 监测点
monitorPositionList: [
{
equipmentName: "一中避险硐室氧气", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
{
equipmentName: "一中避险硐室一氧化碳", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
],
},
{
isWarning: 0, //是否报警
x: 816,
y: 221,
name: "东风井",
// 监测点
monitorPositionList: [
{
equipmentName: "一中避险硐室氧气", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
{
equipmentName: "一中避险硐室一氧化碳", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
],
},
{
isWarning: 0, //是否报警
x: 75,
y: 331,
name: "二中避险硐室",
// 监测点
monitorPositionList: [
{
equipmentName: "一中避险硐室氧气", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
{
equipmentName: "一中避险硐室一氧化碳", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
],
},
{
isWarning: 0, //是否报警
x: 153,
y: 357,
name: "二中主运输港",
// 监测点
monitorPositionList: [
{
equipmentName: "一中避险硐室氧气", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
{
equipmentName: "一中避险硐室一氧化碳", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
],
},
{
isWarning: 0, //是否报警
x: 217,
y: 366,
name: "二中中运输港",
// 监测点
monitorPositionList: [
{
equipmentName: "一中避险硐室氧气", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
{
equipmentName: "一中避险硐室一氧化碳", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
],
},
{
isWarning: 0, //是否报警
x: 317,
y: 379,
name: "二中运输港",
// 监测点
monitorPositionList: [
{
equipmentName: "一中避险硐室氧气", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
{
equipmentName: "一中避险硐室一氧化碳", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
],
},
{
isWarning: 0, //是否报警
x: 128,
y: 396,
name: "二中西采区",
// 监测点
monitorPositionList: [
{
equipmentName: "一中避险硐室氧气", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
{
equipmentName: "一中避险硐室一氧化碳", //设备名称
equipmentTy: "", //设备类型
isWarning: 0, //是否报警
},
],
},
], ],
}; };
}, },
...@@ -503,7 +315,7 @@ export default { ...@@ -503,7 +315,7 @@ export default {
this.playFun(this.sssjData); this.playFun(this.sssjData);
}); });
getDeviceStatus().then((res) => { getDeviceStatus().then((res) => {
console.log(res, "中间图片"); this.equipmentList = res.data;
}); });
}, },
created() {}, created() {},
...@@ -676,41 +488,6 @@ export default { ...@@ -676,41 +488,6 @@ export default {
}, },
// 查看设备24H实时数据 // 查看设备24H实时数据
lookRealData(item, i) { lookRealData(item, i) {
this.upWindowData.upWindowActive = i;
this.upWindowData.upWindowVisible = true;
this.classOption.autoPlay = false;
console.log(item);
getDeviceData({ tpName: item.tpName }).then((res) => {});
let a = [
"01:00",
"02:00",
"03:00",
"04:00",
"05:00",
"06:00",
"07:00",
"08:00",
"09:00",
"10:00",
"11:00",
"12:00",
"13:00",
"14:00",
"15:00",
"16:00",
"17:00",
"18:00",
"19:00",
"20:00",
"21:00",
"22:00",
"23:00",
];
let b = [
29.1, 28, 27, 26, 25, 24, 29, 25, 28, 26, 28, 27, 26, 24, 28, 21, 29,
28, 24, 26, 28, 24, 24, 26,
];
let grid = { let grid = {
left: 0, left: 0,
right: "1.7%", right: "1.7%",
...@@ -718,7 +495,27 @@ export default { ...@@ -718,7 +495,27 @@ export default {
top: "7%", top: "7%",
containLabel: true, containLabel: true,
}; };
this.initEchartBox("chartBox", a, b, 25, 0, grid);
let xData = [];
let yData = [];
getDeviceData({ id: item.id }).then((res) => {
if (res.code == 200) {
this.upWindowData.upWindowActive = i;
this.upWindowData.upWindowVisible = true;
this.upWindowData.title = item.tpName;
this.upWindowData.date = res.data.day;
this.classOption.autoPlay = false;
let threshold = 0;
res.data.envScreenEditDto.forEach((i) => {
xData.push(i.time);
yData.push(i.value);
});
threshold = res.data.threshold || 0;
this.initEchartBox("chartBox", xData, yData, threshold, 0, grid);
} else {
this.$message.error("数据请求失败！");
}
});
}, },
// 关闭弹窗 // 关闭弹窗
closeUpWindow() { closeUpWindow() {
...@@ -790,6 +587,15 @@ export default { ...@@ -790,6 +587,15 @@ export default {
}, },
immediate: true, immediate: true,
}, },
tableData2: {
handler() {
// 数据更改时也要加
this.$nextTick(() => {
this.$refs.RightScroll.reset();
});
},
immediate: true,
},
}, },
}; };
</script> </script>
...@@ -963,6 +769,7 @@ export default { ...@@ -963,6 +769,7 @@ export default {
bottom: 10px; bottom: 10px;
left: -81px; left: -81px;
padding: 9px 14px 14px 14px; padding: 9px 14px 14px 14px;
z-index: 999;
display: none; display: none;
p { p {
font-family: Source Han Sans SC; font-family: Source Han Sans SC;
...@@ -1105,6 +912,8 @@ export default { ...@@ -1105,6 +912,8 @@ export default {
overflow: hidden; overflow: hidden;
.item { .item {
padding-left: 0px; padding-left: 0px;
margin-bottom: 0px;
margin-top: 0px;
} }
.custom-item2 { .custom-item2 {
width: 100%; width: 100%;
...@@ -1210,7 +1019,7 @@ export default { ...@@ -1210,7 +1019,7 @@ export default {
} }
} }
.date-title { .date-title {
width: 108px; width: 118px;
height: 18px; height: 18px;
font-weight: 500; font-weight: 500;
font-size: 22px; font-size: 22px;
......
src/views/Screen/items/psxt.vue
View file @ b954628d
<template> <template>
<div>
<div class="app-container home"> <div class="app-container home">
<div id="cesiumContainer"> <div id="cesiumContainer">
<div class="center-title-box"> <div class="center-title-box">
...@@ -23,8 +24,8 @@ ...@@ -23,8 +24,8 @@
</div> </div>
<div class="water-pump pst1"> <div class="water-pump pst1">
<div class="H36"> <div class="H36">
<div class="button on">开启</div> <div class="button on" @click="openWaterPump">开启</div>
<div class="button off">关闭</div> <div class="button off" @click="closeWaterPump">关闭</div>
</div> </div>
<div class="H164"> <div class="H164">
<div class="phd-left"></div> <div class="phd-left"></div>
...@@ -121,15 +122,42 @@ ...@@ -121,15 +122,42 @@
</div> </div>
</div> </div>
</div> </div>
<div class="up-window" v-show="upWindowShow">
<div class="up-window-box">
<p><span></span>开启/关闭水泵</p>
<i class="el-icon-close close-button" @click="upWindowShow = false"></i>
<div class="W400">
<span>请输入密码</span>
<el-input placeholder="" v-model="password" show-password></el-input>
</div>
<div>
<div class="button close">关闭</div>
<div class="button">开启</div>
</div>
</div>
</div>
</div>
</template> </template>
<script> <script>
export default { export default {
name: "cesium", name: "cesium",
data() { data() {
return {}; return {
password: "",
upWindowShow: false,
};
}, },
created() {}, created() {},
methods: {}, methods: {
// 水泵开启按钮
openWaterPump() {
this.upWindowShow = true;
},
// 水泵关闭按钮
closeWaterPump() {
this.upWindowShow = true;
},
},
}; };
</script> </script>
...@@ -223,6 +251,7 @@ export default { ...@@ -223,6 +251,7 @@ export default {
border: 2px solid #d8efff; border: 2px solid #d8efff;
border-radius: 2px; border-radius: 2px;
background: RGBA(0, 26, 49, 1); background: RGBA(0, 26, 49, 1);
cursor: pointer;
} }
.on { .on {
&.active { &.active {
...@@ -307,4 +336,97 @@ export default { ...@@ -307,4 +336,97 @@ export default {
} }
} }
} }
.up-window {
width: 100%;
height: 100%;
background: RGBA(4, 21, 42, 0.6);
position: absolute;
z-index: 9999;
top: 0;
left: 0;
.up-window-box {
width: 588px;
height: 350px;
background: linear-gradient(0deg, #062451 0%, #09162d 100%);
box-shadow: 0px 15px 11px 2px rgba(0, 20, 39, 0.31);
border: 2px solid #11b9ff;
opacity: 1;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
padding: 20px 37px 37px 27px;
color: #ffffff;
p {
width: 500px;
height: 37px;
margin: 0px;
background: url("~@/assets/images/screen/psxt/title.png") no-repeat center;
background-size: 100%;
font-weight: 500;
font-size: 22px;
color: #ffffff;
height: 37px;
background-position-y: 9px;
span {
width: 27px;
display: inline-block;
}
}
.close-button {
font-size: 30px;
position: absolute;
top: 16px;
right: 16px;
cursor: pointer;
&:hover {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
-webkit-transition: -webkit-transform 1s linear;
transition: transform 1s linear;
}
}
.W400 {
width: 400px;
margin: auto;
::v-deep .el-input__inner {
border-radius: 0px !important;
height: 52px;
}
span {
font-weight: 400;
font-size: 21px;
color: #ffffff;
margin-top: 60px;
display: inline-block;
margin-bottom: 15px;
}
}
.button {
width: 110px;
height: 42px;
background: #11b9ff;
border-radius: 4px;
font-weight: 400;
font-size: 20px;
color: #ffffff;
text-align: center;
line-height: 42px;
float: left;
margin-left: 100px;
margin-top: 55px;
cursor: pointer;
&:hover {
background: #66d2ff;
}
&.close {
background: none;
color: #fff;
&:hover {
color: #66d2ff;
}
}
}
}
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment