diff --git a/.env.development b/.env.development index 0a44c04..8e968ab 100644 --- a/.env.development +++ b/.env.development @@ -7,7 +7,9 @@ ENV = 'development' # 开发环境 # VUE_APP_BASE_API = '/dev-api' # 后台 -VUE_APP_BASE_API = 'http://192.168.1.222:8080' +# VUE_APP_BASE_API = 'http://192.168.1.222:8080' +# 云端 +VUE_APP_BASE_API = 'http://106.55.173.225:8090' # 路由懒加载 VUE_CLI_BABEL_TRANSPILE_MODULES = true diff --git a/.env.production b/.env.production index 75ebefa..2e138ea 100644 --- a/.env.production +++ b/.env.production @@ -5,4 +5,6 @@ VUE_APP_TITLE = 铭汉能耗监测控制系统 ENV = 'production' # 生产环境 -VUE_APP_BASE_API = '/prod-api' +# VUE_APP_BASE_API = '/prod-api' +# 后台 +VUE_APP_BASE_API = 'http://106.55.173.225:8090' diff --git a/src/api/centerairC/strategy.js b/src/api/centerairC/strategy.js new file mode 100644 index 0000000..820c236 --- /dev/null +++ b/src/api/centerairC/strategy.js @@ -0,0 +1,10 @@ +import request from "@/utils/request"; + +// 获取设备策略管理列表 +export function policyListData(query) { + return request({ + url: "/policy/list", + method: "get", + params: query, + }); +} diff --git a/src/api/centerairC/sysMonitor.js b/src/api/centerairC/sysMonitor.js index c07212e..5d9a35a 100644 --- a/src/api/centerairC/sysMonitor.js +++ b/src/api/centerairC/sysMonitor.js @@ -16,6 +16,14 @@ export function runTime() { }); } +//获取一键启停信息 +export function oneKeyButton(query) { + return request({ + url: "/device/cs/oneKeyButton", + method: "get", + params: query, + }); +} // 获取系统性能数据 export function sysPerformance() { return request({ diff --git a/src/api/hotWater/waterControl.js b/src/api/hotWater/waterControl.js index 0c8643c..b1dbd68 100644 --- a/src/api/hotWater/waterControl.js +++ b/src/api/hotWater/waterControl.js @@ -1,6 +1,6 @@ import request from "@/utils/request"; -// 控制列表 +// 热水设备列表 export function waterOperateList(query) { return request({ url: "/device/hotWater/operateList", @@ -8,7 +8,7 @@ export function waterOperateList(query) { params: query, }); } -// 系统控制 +// 热水设备控制 export function operationConrol(data) { return request({ url: "/device/operation", diff --git a/src/assets/icons/svg/delaySwitch.svg b/src/assets/icons/svg/delaySwitch.svg new file mode 100644 index 0000000..d747953 --- /dev/null +++ b/src/assets/icons/svg/delaySwitch.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/svg/deviceStrategy.svg b/src/assets/icons/svg/deviceStrategy.svg new file mode 100644 index 0000000..78c7542 --- /dev/null +++ b/src/assets/icons/svg/deviceStrategy.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/svg/strategy.svg b/src/assets/icons/svg/strategy.svg new file mode 100644 index 0000000..0fdb76c --- /dev/null +++ b/src/assets/icons/svg/strategy.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/images/arrow-l.png b/src/assets/images/arrow-l.png new file mode 100644 index 0000000..2b7815c Binary files /dev/null and b/src/assets/images/arrow-l.png differ diff --git a/src/assets/images/border1.png b/src/assets/images/border1.png new file mode 100644 index 0000000..5a7c15b Binary files /dev/null and b/src/assets/images/border1.png differ diff --git a/src/assets/images/border2.png b/src/assets/images/border2.png new file mode 100644 index 0000000..3eaa382 Binary files /dev/null and b/src/assets/images/border2.png differ diff --git a/src/assets/images/border3.png b/src/assets/images/border3.png new file mode 100644 index 0000000..0a16b0f Binary files /dev/null and b/src/assets/images/border3.png differ diff --git a/src/assets/images/butterflyValve.png b/src/assets/images/butterflyValve.png new file mode 100644 index 0000000..a4f0f98 Binary files /dev/null and b/src/assets/images/butterflyValve.png differ diff --git a/src/assets/images/butterflyValve1.png b/src/assets/images/butterflyValve1.png new file mode 100644 index 0000000..47b20ef Binary files /dev/null and b/src/assets/images/butterflyValve1.png differ diff --git a/src/assets/images/coolingPump.png b/src/assets/images/coolingPump.png new file mode 100644 index 0000000..fb24cc6 Binary files /dev/null and b/src/assets/images/coolingPump.png differ diff --git a/src/assets/images/coolingTower.png b/src/assets/images/coolingTower.png new file mode 100644 index 0000000..4b2358a Binary files /dev/null and b/src/assets/images/coolingTower.png differ diff --git a/src/assets/images/datatime.png b/src/assets/images/datatime.png new file mode 100644 index 0000000..0b83182 Binary files /dev/null and b/src/assets/images/datatime.png differ diff --git a/src/assets/images/freezingPump.png b/src/assets/images/freezingPump.png new file mode 100644 index 0000000..ea33cef Binary files /dev/null and b/src/assets/images/freezingPump.png differ diff --git a/src/assets/images/host.png b/src/assets/images/host.png new file mode 100644 index 0000000..0ca4ff5 Binary files /dev/null and b/src/assets/images/host.png differ diff --git a/src/assets/images/left_line.png b/src/assets/images/left_line.png new file mode 100644 index 0000000..2a6ba61 Binary files /dev/null and b/src/assets/images/left_line.png differ diff --git a/src/assets/images/offOrON.png b/src/assets/images/offOrON.png deleted file mode 100644 index 9b2854f..0000000 Binary files a/src/assets/images/offOrON.png and /dev/null differ diff --git a/src/assets/images/right_line.png b/src/assets/images/right_line.png new file mode 100644 index 0000000..50f7fc9 Binary files /dev/null and b/src/assets/images/right_line.png differ diff --git a/src/assets/images/start.png b/src/assets/images/start.png new file mode 100644 index 0000000..0a4c984 Binary files /dev/null and b/src/assets/images/start.png differ diff --git a/src/assets/images/starthotpum.png b/src/assets/images/starthotpum.png new file mode 100644 index 0000000..fae136d Binary files /dev/null and b/src/assets/images/starthotpum.png differ diff --git a/src/assets/images/startpum.png b/src/assets/images/startpum.png new file mode 100644 index 0000000..c32a1d7 Binary files /dev/null and b/src/assets/images/startpum.png differ diff --git a/src/assets/images/strategy-border.png b/src/assets/images/strategy-border.png new file mode 100644 index 0000000..984b851 Binary files /dev/null and b/src/assets/images/strategy-border.png differ diff --git a/src/assets/images/waterBox.png b/src/assets/images/waterBox.png new file mode 100644 index 0000000..19c1cb3 Binary files /dev/null and b/src/assets/images/waterBox.png differ diff --git a/src/assets/images/wave.png b/src/assets/images/wave.png new file mode 100644 index 0000000..4f0a487 Binary files /dev/null and b/src/assets/images/wave.png differ diff --git a/src/assets/images/yuan.png b/src/assets/images/yuan.png new file mode 100644 index 0000000..e5e7b59 Binary files /dev/null and b/src/assets/images/yuan.png differ diff --git a/src/assets/images/路径 1112.png b/src/assets/images/路径 1112.png new file mode 100644 index 0000000..81e15d1 Binary files /dev/null and b/src/assets/images/路径 1112.png differ diff --git a/src/assets/styles/element-ui.scss b/src/assets/styles/element-ui.scss index f31a8ce..33000fc 100644 --- a/src/assets/styles/element-ui.scss +++ b/src/assets/styles/element-ui.scss @@ -1351,10 +1351,14 @@ .el-upload-list__item-actions { border: solid 1px #0163a8 !important; } -.el-upload--picture-card{ +.el-upload--picture-card { background-color: transparent !important; border: 1px dashed #0163a8 !important; } -.el-switch__label{ +.el-switch__label { color: #d1cfcf; } +.el-switch__core { + border: 1px solid #ff4949; + background: #ff4949; +} diff --git a/src/utils/global.js b/src/utils/global.js index 5503d2f..2ad0e0a 100644 --- a/src/utils/global.js +++ b/src/utils/global.js @@ -1,6 +1,6 @@ // 图片url -export const imgUrl = "http://192.168.1.222:8080"; +export const imgUrl = "http://106.55.173.225:8090"; export default { diff --git a/src/views/centerairC/delaySwitch/index.vue b/src/views/centerairC/delaySwitch/index.vue new file mode 100644 index 0000000..327b3c7 --- /dev/null +++ b/src/views/centerairC/delaySwitch/index.vue @@ -0,0 +1,433 @@ + + + + + + diff --git a/src/views/centerairC/deviceStrategy/index.vue b/src/views/centerairC/deviceStrategy/index.vue new file mode 100644 index 0000000..e3b83b4 --- /dev/null +++ b/src/views/centerairC/deviceStrategy/index.vue @@ -0,0 +1,348 @@ + + + + + + diff --git a/src/views/centerairC/sysControl/index.vue b/src/views/centerairC/sysControl/index.vue index ee0d040..d207f11 100644 --- a/src/views/centerairC/sysControl/index.vue +++ b/src/views/centerairC/sysControl/index.vue @@ -5,26 +5,22 @@
运行设备
- {{ statistics.running }}/{{ deviceList.length }} + {{ statistics.running }}/{{ total }}
手动模式
-
- {{ statistics.manual }}/{{ deviceList.length }} -
+
{{ statistics.manual }}/{{ total }}
自动模式
- {{ statistics.auto }}/{{ deviceList.length }} + {{ statistics.auto }}/{{ total }}
故障设备
-
- {{ statistics.warn }}/{{ deviceList.length }} -
+
{{ statistics.warn }}/{{ total }}
@@ -34,6 +30,7 @@
运行状态
手动控制
手自动切换
+
本地远程状态
故障报警
频率调节
频率反馈
@@ -60,14 +57,24 @@ > +
+ + +
{{ item.automaticText }}{{ item.localRemote }}
@@ -95,6 +102,8 @@
设备名称
+
手自动切换
+
本地远程状态
手动阀关控制
阀关反馈
手动阀开控制
@@ -102,6 +111,26 @@
{{ item.name }}
+
+ + +
+
+ {{ item.localRemote }} +
d.automaticText === false + ).length; + const deviceAuto = this.deviceList.filter( + (d) => d.automaticText === true + ).length; + const valveManual = this.valveList.filter( + (v) => v.automaticText === false + ).length; + const valveAuto = this.valveList.filter( + (v) => v.automaticText === true + ).length; + return { running: this.deviceList.filter((d) => d.runStatus === "运行").length, - manual: this.deviceList.filter((d) => d.automaticText === "手动") - .length, - auto: this.deviceList.filter((d) => d.automaticText === "自动").length, + manual: deviceManual + valveManual, + auto: deviceAuto + valveAuto, warn: this.deviceList.filter((d) => d.warnText === "故障").length, }; }, @@ -188,6 +230,7 @@ export default { this.getOperationList(); }, methods: { + // 系统控制列表 getOperationList() { operationList({ systemType: 0 }).then((res) => { console.log("列表返回res", res); @@ -206,48 +249,94 @@ export default { name: element.name, }; - // 只处理前四个子元素 const limitedChildren = element.children; limitedChildren.forEach((child) => { if (child.name) { - if (child.name.includes("运行状态")) { + // 运行状态 + if (child.paramType === "1" && !child.name.includes("阀")) { deviceItem.runStatus = - child.value === "0.000" ? "不运行" : "运行"; - } else if (child.name.includes("启停控制")) { + Number(child.value) == 0 ? "不运行" : "运行"; + // 手动控制 + } else if ( + child.paramType === "2" && + !child.name.includes("阀") + ) { deviceItem.controlText = - child.value === "0.000" ? false : true; + Number(child.value) == 0 ? false : true; deviceItem.controlId = child.id; - } else if (child.name.includes("手自动状态")) { + // 手自动切换 0手动 + } else if ( + child.paramType === "6" && + !child.name.includes("阀") + ) { deviceItem.automaticText = - child.value === "0.000" ? "自动" : "手动"; - } else if (child.name.includes("故障报警")) { + Number(child.value) == 0 ? false : true; + deviceItem.automaticId = child.id; + // 故障报警 + } else if ( + child.paramType === "5" && + !child.name.includes("阀") + ) { deviceItem.warnText = - child.value === "0.000" ? "未故障" : "故障"; - } else if (child.name.includes("频率调节")) { + Number(child.value) == 0 ? "未故障" : "故障"; + // 本地远程 + } else if ( + child.paramType === "22" && + !child.name.includes("阀") + ) { + deviceItem.localRemote = + Number(child.value) == 0 ? "本地" : "远程"; + } else if ( + child.paramType === "3" && + !child.name.includes("阀") + ) { deviceItem.frequencySet = - child.value === "0.000" ? "0" : child.value; + Number(child.value) == 0 ? "0" : child.value; deviceItem.frequencyId = child.id; - } else if (child.name.includes("频率反馈")) { + // 频率反馈 + } else if (child.paramType === "4") { deviceItem.frequency = child.value; + // 阀开 } else if (child.name.includes("阀开反馈")) { valveItem.openStauts = - child.value === "0.000" ? "关闭" : "开启"; + Number(child.value) == 0 ? "关闭" : "开启"; + // 阀开反馈 } else if ( child.name.includes("阀开") && !child.name.includes("反馈") ) { - valveItem.openText = child.value === "0.000" ? false : true; + valveItem.openText = + Number(child.value) == 0 ? false : true; valveItem.openId = child.id; + // 阀关反馈 } else if ( child.name.includes("阀关") && !child.name.includes("反馈") ) { valveItem.colseText = - child.value === "0.000" ? false : true; + (child.value === Number(child.value)) == 0 ? false : true; valveItem.closeId = child.id; + // 阀关 } else if (child.name.includes("阀关反馈")) { valveItem.closeStatus = - child.value === "0.000" ? "关闭" : "开启"; + (child.value === Number(child.value)) == 0 + ? "关闭" + : "开启"; + // 阀门的-本地远程状态 + } else if ( + child.paramType === "22" && + child.name.includes("阀") + ) { + valveItem.localRemote = + Number(child.value) == 0 ? "本地" : "远程"; + // 阀门的-手自动切换 + } else if ( + child.paramType === "6" && + child.name.includes("阀") + ) { + valveItem.automaticText = + Number(child.value) == 0 ? false : true; + valveItem.automaticId = child.id; } } }); @@ -264,6 +353,7 @@ export default { }); console.log("处理过的this.deviceList", this.deviceList); console.log("处理过的this.valveList", this.valveList); + this.total = this.deviceList.length + this.valveList.length; } }); }, @@ -276,7 +366,7 @@ export default { handleEnter(item) { console.log("请求后端"); this.$confirm( - `确定要修改"${item.name}"的频率为:${item.frequencySet} Hz吗?"`, + `确定要修改"${item.name}"的频率为:${item.frequencySet} Hz吗?`, "提示", { confirmButtonText: "确定", @@ -285,14 +375,14 @@ export default { } ) .then(() => { - this.operationConrol(item.frequencyId, item.frequencySet); + this.hadleOperationConrol(item.frequencyId, item.frequencySet); }) .catch(() => { // 用户取消操作，需要更新原来的频率 this.getOperationList(); }); }, - //启停控制 + //手动控制 handleControlText(item) { this.$confirm( `确定要切换设备"${item.name}"的状态为:${ @@ -306,7 +396,7 @@ export default { } ) .then(() => { - // 这里调用请求函数，示例中只是简单打印信息 + // 这里调用请求函数 console.log("请求后台", item.controlText); let param = null; if (item.controlText) { @@ -314,7 +404,7 @@ export default { } else { param = 0; } - this.operationConrol(item.controlId, param); + this.hadleOperationConrol(item.controlId, param); }) .catch(() => { // 用户取消操作，恢复开关状态 @@ -322,6 +412,36 @@ export default { console.log("不请求后台"); }); }, + // 手自动切换 + handleAutomaticText(item) { + this.$confirm( + `确定要切换设备"${item.name}"的状态为:${ + item.automaticText ? "自动" : "手动 吗?" + }`, + "提示", + { + confirmButtonText: "确定", + cancelButtonText: "取消", + type: "warning", + } + ) + .then(() => { + // 这里调用请求函数 + console.log("请求后台", item.automaticText); + let param = null; + if (item.automaticText) { + param = 1; + } else { + param = 0; + } + this.hadleOperationConrol(item.automaticId, param); + }) + .catch(() => { + // 用户取消操作，恢复开关状态 + item.automaticText = !item.automaticText; + console.log("不请求后台"); + }); + }, //蝶阀关闭控制 handleValveClose(item) { this.$confirm( @@ -342,7 +462,7 @@ export default { } else { param = 0; } - this.operationConrol(item.closeId, param); + this.hadleOperationConrol(item.closeId, param); }) .catch(() => { // 用户取消操作，恢复开关状态 @@ -370,7 +490,7 @@ export default { } else { param = 0; } - this.operationConrol(item.openId, param); + this.hadleOperationConrol(item.openId, param); }) .catch(() => { // 用户取消操作，恢复开关状态 @@ -378,23 +498,60 @@ export default { console.log("不请求后台"); }); }, - operationConrol(id, param) { + // 蝶阀-手自动切换 + handleValveControlText(item) { + this.$confirm( + `确定要切换设备"${item.name}"的状态为:${ + item.automaticText ? "自动" : "手动 吗?" + }`, + "提示", + { + confirmButtonText: "确定", + cancelButtonText: "取消", + type: "warning", + } + ) + .then(() => { + // 这里调用请求函数，示例中只是简单打印信息 + console.log("请求后台", item.automaticText); + let param = null; + if (item.automaticText) { + param = 1; + } else { + param = 0; + } + this.hadleOperationConrol(item.automaticId, param); + }) + .catch(() => { + // 用户取消操作，恢复开关状态 + item.automaticText = !item.automaticText; + console.log("不请求后台"); + }); + }, + hadleOperationConrol(id, param) { let data = { id: id, param: param, }; console.log("操作参数", data); - operationConrol([data]).then((res) => { - if (res.code == 200) { - this.$modal.msgSuccess("操作成功"); - // 更新所有设备状态; - this.getOperationList(); - } else { - this.$modal.msgError("操作失败"); + operationConrol([data]) + .then((res) => { + if (res.code == 200) { + this.$modal.msgSuccess("操作成功"); + // 更新所有设备状态; + this.getOperationList(); + } else { + // this.$modal.msgError("操作失败"); + console.log("应该更新状态的"); + // 更新所有设备状态; + this.getOperationList(); + } + }) + .catch((error) => { + console.log("请求发生错误，更新设备状态", error); // 更新所有设备状态; this.getOperationList(); - } - }); + }); }, }, }; @@ -421,6 +578,9 @@ export default { .device-name { flex: 1; white-space: nowrap; + .el-switch{ + width: 120px !important; + } .run { display: flex; flex-direction: row; diff --git a/src/views/centerairC/sysMonitor/index.vue b/src/views/centerairC/sysMonitor/index.vue index ff2294c..cc19ebf 100644 --- a/src/views/centerairC/sysMonitor/index.vue +++ b/src/views/centerairC/sysMonitor/index.vue @@ -10,17 +10,17 @@
室外湿度： - {{ weatherObj.humidityRatio }} + {{ weatherObj.humidity }} %
室外含湿： - {{ weatherObj.humidity }} + {{ weatherObj.humidityRatio }} g/kg
室外焓值： - {{ weatherObj.wetBulbTemp }} + {{ weatherObj.enthalpy }} kj/kg
@@ -30,48 +30,50 @@
室外湿球： - {{ weatherObj.enthalpy }} + {{ weatherObj.wetBulbTemp }} ℃
-
系统性能
-
- 实时EER： - {{ performanceObj.realEER }} - kw/kw -
-
- 实时功率： - {{ performanceObj.realPower }} - kw -
-
- 实时冷量： - {{ performanceObj.realCold }} - kw -
-
- 全年EER： - {{ performanceObj.yearEER }} - kw -
-
- 全年用电： - {{ performanceObj.yearPower }} - kw/h -
-
- 全年产冷： - {{ performanceObj.yearCold }} - kw +
+
+ 实时EER： + {{ performanceObj.realEER }} + kw/kw +
+
+ 实时功率： + {{ performanceObj.realPower }} + kw +
+
+ 实时冷量： + {{ performanceObj.realCold }} + kw +
+
+ 全年EER： + {{ performanceObj.yearEER }} + kw +
+
+ 全年用电： + {{ performanceObj.yearPower }} + kw/h +
+
+ 全年产冷： + {{ performanceObj.yearCold }} + kw +
+
系统性能
-
- -
OFF
+
+
ON
+
OFF
{ + if (res.code == 200) { + console.log("一键启停返回信息", res); + this.oneKeyButtonId = res.data.id; + if (Number(res.data.curValue) == 0) { + this.isShowOn = false; + } else { + this.isShowOn = true; + } + } + }); + }, + // 一键启停按钮 + handleOneKeyButton() { + let param = ""; + let paramText = ""; + if (this.isShowOn) { + // this.isShowOn为true代表ON,此时点击按钮想OFF + param = 0; + paramText = "一键关闭"; + } else { + param = 1; + paramText = "一键开启"; + } + this.$confirm(`确定要${paramText}吗?`, "提示", { + confirmButtonText: "确定", + cancelButtonText: "取消", + type: "warning", + }) + .then(() => { + let data = { + id: this.oneKeyButtonId, + param: param, + }; + operationConrol([data]) + .then((res) => { + if (res.code == 200) { + this.$modal.msgSuccess("操作成功"); + // 更新状态; + this.getOneKeyButton(); + } else { + this.getOneKeyButton(); + } + }) + .catch((error) => { + console.log("请求发生错误，更新设备状态", error); + this.ggetOneKeyButton(); + }); + }) + .catch(() => {}); + }, // 系统监测数据 getMonitorList() { monitorList({ systemType: 0 }).then((res) => { @@ -744,7 +808,7 @@ export default { Number(item.collectValue) === 0 ) { valveCloseFeedbackFound = true; - console.log("冷冻蝶阀阀关反馈应该是true才对呀"); + // console.log("冷冻蝶阀阀关反馈应该是true才对呀"); } } } @@ -1261,70 +1325,69 @@ export default { } } .weather { + min-width: 2.5rem; + z-index: 10; position: absolute; - top: 0.2rem; - left: -1rem; + top: 0rem; + left: -0.8rem; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; font-size: 0.16rem; color: rgb(18, 155, 209); + background-image: url(../../../assets/images/border1.png); + background-size: 100% 100%; + background-repeat: no-repeat; + padding: 0.15rem 0 0.25rem 0rem; } .weather-li { - width: 2rem; - padding: 0.05rem 0 0.05rem 0.1rem; + width: 100%; + padding: 0.05rem 0 0.05rem 0.3rem; /* 初始设置上下边框宽度为 1px，颜色和样式可以先设为透明，后续由 border-image 覆盖 */ border-top: 1px solid transparent; - border-bottom: 1px solid transparent; - /* 使用线性渐变创建 border-image，这里颜色 A 以 #ff0000（红色）为例 */ - border-image: linear-gradient(to right, #576ef0, transparent 50%, #576ef0); - /* 设置 border-image 的切片，这里设置为 1 0，即上下边框应用渐变，左右不应用 */ - border-image-slice: 1 0; - /* 设置 border-image 的宽度，这里设置为 1，与 border-width 对应 */ - border-image-width: 1; + border-bottom: 1px dashed #1a3f8f; position: relative; .deepColor { display: inline-block; margin: 0 0.1rem 0 0.05rem; - color: rgb(95, 161, 247); + color: #20ebfa; font-weight: bold; + font-family: DIN; + font-size: 0.20rem; } } - .weather-li::before, - .weather-li::after { - content: ""; - position: absolute; - top: 0; - bottom: 0; - width: 1px; - background-color: rgb(95, 161, 247); - } - - .weather-li::before { - left: 0; - background-color: rgb(95, 161, 247); - } - .weather-li::after { - right: 0; - background-color: rgb(95, 161, 247); - } .performance { position: absolute; - top: 5.2rem !important; - right: 0 !important; + top: 4.7rem !important; + right: -1rem !important; + display: flex; + flex-direction: column; + align-items: flex-start; + justify-content: flex-start; + font-size: 0.16rem; + color: rgb(18, 155, 209); + } + .perdformance-bg { + min-width: 2.5rem; + z-index: 10; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; font-size: 0.16rem; color: rgb(18, 155, 209); + background-image: url(../../../assets/images/border1.png); + background-size: 100% 100%; + background-repeat: no-repeat; + padding: 0.15rem 0 0.25rem 0rem; } .title { width: 100%; background-image: url(../../../assets/images/text_img_title.png); background-repeat: no-repeat; + background-repeat: no-repeat; background-size: 3rem 0.45rem; background-position: bottom left; font-family: SourceHanSansCN-Medium; @@ -1333,11 +1396,15 @@ export default { line-height: 0.6rem; color: rgba(209, 214, 223, 1); padding-left: 0.6rem; + margin-top: -0.15rem; } .offClass { position: absolute; width: 1.4rem; - height: 1.2rem; + height: 1.4rem; + background-image: url(../../../assets/images/border2.png); + background-repeat: no-repeat; + background-size: 100% 100%; top: 0; right: 0rem; z-index: 10; @@ -1345,16 +1412,42 @@ export default { flex-direction: column; align-items: center; justify-content: center; - font-size: 0.18rem; - color: #2fbda5; cursor: pointer; - .off-img { - width: 1.4rem; - height: 1.2rem; + .off-bg { position: absolute; - top: 0; - left: 0; + left: 0.38rem; + top: 0.3rem; + width: 0.8rem; + height: 0.8rem; + background-image: url(../../../assets/images/border3.png); + background-repeat: no-repeat; + background-size: 100% 100%; + text-align: center; + line-height: 0.8rem; + font-family: DIN; + font-size: 0.24rem; + color: #20ebfa; + font-weight: bold; + animation: rotateZ 5s linear infinite; + transition: 0.6s; /* 设置过渡时间，控制翻转速度 */ + transform-style: preserve-3d; /* 保持子元素的 3D 效果 */ + } + /* 定义旋转动画 */ + @keyframes rotateZ { + 0% { + transform: rotateY(0deg); /* 初始状态，不旋转 */ + } + 50% { + transform: rotateY(180deg); /* 旋转到 180 度，呈现翻面效果 */ + } + 100% { + transform: rotateY(360deg); /* 旋转回 360 度，回到初始状态 */ + } } } + /* 鼠标悬停时移除动画 */ +.offClass:hover .off-bg { + animation: none; +} } diff --git a/src/views/components/dynamicArrow.vue b/src/views/components/dynamicArrow.vue new file mode 100644 index 0000000..6e01cd8 --- /dev/null +++ b/src/views/components/dynamicArrow.vue @@ -0,0 +1,85 @@ + + + + diff --git a/src/views/components/waterTank.vue b/src/views/components/waterTank.vue new file mode 100644 index 0000000..34b8c13 --- /dev/null +++ b/src/views/components/waterTank.vue @@ -0,0 +1,126 @@ + + + + + diff --git a/src/views/hotWater/waterControl/index.vue b/src/views/hotWater/waterControl/index.vue index 97e1c35..217b9ca 100644 --- a/src/views/hotWater/waterControl/index.vue +++ b/src/views/hotWater/waterControl/index.vue @@ -2,7 +2,7 @@
-
+
-
-
-
正常
-
0个
-
-
-
报警
-
0个
-
-
-
异常
-
0个
-
-
-
离线
-
0个
-
-
-
-
- -
{{ buildingName }}
+
+ +
楼层：{{ currentName }}
+
+
+ + + + + + +
+
+
+
{{ item.name }}
+
+ +
+ +
+
+
开关状态:
+
+ + +
+
+
+
故障信息:
+ {{ item.alarmStatus }} + {{ + item.alarmStatus + }} +
+
+
当前频率:
+
{{ item.frequency }}Hz
+
+
+
+ +
+ +
+
+
开关状态:
+
+ + +
+
+
+
故障信息:
+ {{ item.alarmStatus }} + {{ + item.alarmStatus + }} +
+
+
实际温度:
+
{{ item.temp }}℃
+
+
+
设定温度:
+
+ +
+
+
+
+ +
+ +
+
+
实际液位:
+
{{ item.waterLevel }} %
+
+
+
设置液位:
+ +
+
+
采集时间:
+
{{ item.curTime }}
+
+
+
+
-
@@ -65,22 +184,26 @@ - - \ No newline at end of file +
+
+ +
+ + + +
+
+
+
+ +
楼层：{{ currentName }}
+
+
+ + + + + + +
+
+
+ + + + + +