Skip to content

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

fix:排水系统接口联调

parent 704e7601
Hide whitespace changes
Inline Side-by-side
Showing with 212 additions and 108 deletions
src/api/tyler/psxt.js 0 → 100644
View file @ 05e51c15
import request from "@/utils/request";
// 查询实时监测
export function getDraData(query) {
return request({
url: "/business/screen/dra/draData",
method: "get",
params: query,
});
}
// 修改水泵开关
export function updatePumpSwitch(data) {
return request({
url: "/business/screen/dra/changePumpStatus",
method: "post",
data: data,
});
}
src/views/Screen/items/psxt.vue
View file @ 05e51c15
......@@ -4,120 +4,92 @@
<div id="cesiumContainer">
<div class="center-title-box">
<div class="control-state">
<p>
<p v-if="intelligentControl == 0">
<span class="icon-img"></span>
<span>已开启智能控制</span>
</p>
<p v-else>
<span class="icon-img"></span>
<span>未开启智能控制</span>
</p>
</div>
<div class="title-box top">
<p class="title">液体高度:10m</p>
<p class="name">蓄水池</p>
<p class="title">
液体高度:{{ sumpData | sumpFilter(0, "heghtThreshold") }}m
</p>
<p class="name">{{ sumpData | sumpFilter(0, "sumpName") }}</p>
</div>
<div class="title-box center">
<p class="title">液体高度:10m</p>
<p class="name">二中水仓</p>
<p class="title">
液体高度:{{ sumpData | sumpFilter(1, "heghtThreshold") }}m
</p>
<p class="name">{{ sumpData | sumpFilter(1, "sumpName") }}</p>
</div>
<div class="title-box bottom">
<p class="title">液体高度:10m</p>
<p class="name">五中水仓</p>
</div>
</div>
<div class="water-pump pst1">
<div class="H36">
<div class="button on" @click="openWaterPump">开启</div>
<div class="button off" @click="closeWaterPump">关闭</div>
</div>
<div class="H164">
<div class="phd-left"></div>
<div class="phd-right">
<div class="phd-top"></div>
<div class="water-pump-img-left"></div>
<p>5#水泵</p>
</div>
</div>
</div>
<div class="water-pump pst2">
<div class="H36">
<div class="button on">开启</div>
<div class="button off">关闭</div>
</div>
<div class="H164">
<div class="phd-left"></div>
<div class="phd-right">
<div class="phd-top"></div>
<div class="water-pump-img-left"></div>
<p>5#水泵</p>
</div>
</div>
</div>
<div class="water-pump pst3">
<div class="H36">
<div class="button on">开启</div>
<div class="button off">关闭</div>
</div>
<div class="H164">
<div class="phd-right">
<div class="phd-top"></div>
<div class="water-pump-img-right"></div>
<p>5#水泵</p>
</div>
<div class="phd-left"></div>
</div>
</div>
<div class="water-pump pst4">
<div class="H36">
<div class="button on">开启</div>
<div class="button off">关闭</div>
</div>
<div class="H164">
<div class="phd-left"></div>
<div class="phd-right">
<div class="phd-top"></div>
<div class="water-pump-img-left"></div>
<p>5#水泵</p>
</div>
<p class="title">
液体高度:{{ sumpData | sumpFilter(2, "heghtThreshold") }}m
</p>
<p class="name">{{ sumpData | sumpFilter(2, "sumpName") }}</p>
</div>
</div>
<div class="water-pump pst5">
<div
class="water-pump"
v-for="(item, i) in pumpList"
:key="i"
:class="`pst${Number(item.pumpId) - 3}`"
>
<div class="H36">
<div class="button on">开启</div>
<div class="button off">关闭</div>
</div>
<div class="H164">
<div class="phd-left"></div>
<div class="phd-right">
<div class="phd-top"></div>
<div class="water-pump-img-left"></div>
<p>5#水泵</p>
<div
class="button on"
:class="item.status == 0 ? 'active' : ''"
@click="openWaterPump(item)"
>
开启
</div>
</div>
</div>
<div class="water-pump pst6">
<div class="H36">
<div class="button on">开启</div>
<div class="button off">关闭</div>
</div>
<div class="H164">
<div class="phd-right">
<div class="phd-top"></div>
<div class="water-pump-img-right"></div>
<p>5#水泵</p>
<div
class="button off"
:class="item.status == 1 ? 'active' : ''"
@click="closeWaterPump(item)"
>
关闭
</div>
<div class="phd-left"></div>
</div>
</div>
<div class="water-pump pst7">
<div class="H36">
<div class="button on">开启</div>
<div class="button off">关闭</div>
</div>
<div class="H164">
<div
class="phd-left"
v-show="[5, 6, 1, 2].includes(Number(item.pumpId) - 3)"
></div>
<div class="phd-right">
<div class="phd-top"></div>
<div class="water-pump-img-right"></div>
<p>5#水泵</p>
<div
class=""
:class="
[5, 6, 1, 2].includes(Number(item.pumpId) - 3)
? 'water-pump-img-left'
: 'water-pump-img-right'
"
>
<div
class="tip-box"
:class="
[5, 6, 1, 2].includes(Number(item.pumpId) - 3)
? 'dw'
: 'dwr'
"
>
<p>点击电流：{{ item.motorCurrent }}A</p>
<p>电机轴承温度：{{ item.motorBearingTemp }}℃</p>
<p>水泵轴承温度：{{ item.pumpBearingTemp }}℃</p>
<p>水泵流量：{{ item.pumpFlow }}</p>
<p>排水管路压力：{{ item.drainagePressure }}</p>
</div>
</div>
<p>{{ item.pumpName }}</p>
</div>
<div class="phd-left"></div>
<div
class="phd-left"
v-show="[7, 3, 4].includes(Number(item.pumpId) - 3)"
></div>
</div>
</div>
</div>
......@@ -131,31 +103,101 @@
<el-input placeholder="" v-model="password" show-password></el-input>
</div>
<div>
<div class="button close">关闭</div>
<div class="button">开启</div>
<div class="button close" @click="submitPumpPassword(1)">关闭</div>
<div class="button" @click="submitPumpPassword(0)">开启</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { getDraData, updatePumpSwitch } from "@/api/tyler/psxt.js";
export default {
name: "cesium",
name: "psxt",
data() {
return {
password: "",
upWindowShow: false,
pumpId: "",
intelligentControl: 0,
pumpList: [
{
pumpId: 1,
pumpName: "5#水泵",
pumpStatus: 1,
},
],
sumpData: [
{
sumpId: 1,
sumpName: "5#水池",
heghtThreshold: 10,
},
{
sumpId: 2,
sumpName: "5#水池",
heghtThreshold: 10,
},
{
sumpId: 3,
sumpName: "5#水池",
heghtThreshold: 10,
},
],
pumpList: [],
};
},
created() {},
created() {
this.initPumpList();
},
methods: {
initPumpList() {
getDraData().then((res) => {
//水池数据
if (res.code == 200) {
this.sumpData = res.data[0].value;
this.pumpList = res.data[1].value;
this.intelligentControl = res.data[2].value;
} else {
this.$modal.msgError(res.message);
}
});
},
// 水泵开启按钮
openWaterPump() {
openWaterPump(item) {
this.upWindowShow = true;
// this.submitPumpPassword(pumpId, this.password, 0);
this.pumpId = item.pumpId;
},
// 水泵关闭按钮
closeWaterPump() {
closeWaterPump(item) {
this.upWindowShow = true;
this.pumpId = item.pumpId;
this.password = "";
},
//提交水泵密码
submitPumpPassword(status) {
let pumpId = this.pumpId;
let password = this.password;
if (!password) {
return this.$modal.msgError("请输入密码");
}
updatePumpSwitch({ pumpId, password, status }).then((res) => {
if (res.code === 200) {
this.upWindowShow = false;
this.password = "";
this.$modal.msgSuccess("操作成功");
this.initPumpList();
} else {
this.$modal.msgError(res.message);
}
});
},
},
filters: {
// 水池显示数据过滤
sumpFilter(dateTmp, index, key) {
return dateTmp[index][key];
},
},
};
......@@ -288,6 +330,28 @@ export default {
height: 70px;
background: url("~@/assets/images/screen/psxt/item.png") no-repeat
center;
position: relative;
.tip-box {
width: 182px;
height: 136px;
background: #0a1e36;
border: 2px solid #00deff;
padding: 7px 13px 15px 10px;
opacity: 0.8;
p {
font-size: 17px;
color: #11e0ff;
line-height: 22px;
margin-bottom: -2px;
text-align: left;
font-weight: 400;
}
&.dw {
position: absolute;
top: -26px;
left: 131px;
}
}
}
.water-pump-img-right {
width: 122px;
......@@ -303,33 +367,54 @@ export default {
text-align: center;
margin-top: 3px;
}
.tip-box {
width: 182px;
height: 136px;
background: #0a1e36;
border: 2px solid #00deff;
padding: 7px 13px 15px 10px;
opacity: 0.8;
p {
font-size: 17px;
color: #11e0ff;
line-height: 22px;
margin-bottom: -2px;
text-align: left;
font-weight: 400;
}
&.dwr {
position: absolute;
top: 48px;
left: -189px;
}
}
}
}
&.pst1 {
&.pst5 {
top: 139px;
left: 143px;
}
&.pst2 {
&.pst6 {
top: 139px;
left: 582px;
}
&.pst3 {
&.pst7 {
top: 139px;
left: 1408px;
}
&.pst4 {
&.pst1 {
top: 480px;
left: 0px;
}
&.pst5 {
&.pst2 {
top: 480px;
left: 440px;
}
&.pst6 {
&.pst3 {
top: 480px;
left: 1188px;
}
&.pst7 {
&.pst4 {
top: 480px;
left: 1630px;
}
......
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