runningState.vue 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683
  1. <template>
  2. <view>
  3. <view class="head">
  4. <view class="shang">
  5. <view class="shangItem">
  6. <text>冷水阀</text>
  7. <text>{{formData.LSF}}%</text>
  8. </view>
  9. <view class="shangItem">
  10. <text style="margin-left: 6rpx;">电加热</text>
  11. <view class="buttonItem">
  12. <button class="but" :class="{'active-but': formData.YJDJR_QT == 1}">一</button>
  13. <button class="but" :class="{'active-but': formData.EJDJR_QT == 1}">二</button>
  14. <button class="but" :class="{'active-but': formData.SJDJR_QT == 1}">三</button>
  15. </view>
  16. </view>
  17. <view class="shangItem">
  18. <text>加湿器</text>
  19. <text>{{formData.JSF}}%</text>
  20. </view>
  21. </view>
  22. <view class="comp"></view>
  23. <view class="xia">
  24. <view class="xiaItem">
  25. <text>初效滤网</text>
  26. <view class="xiaBut">
  27. <button class="xiaButton"
  28. :class="{'Red_button': formData.LWDS_CX == 1}">{{ formData.LWDS_CX === '0' ? '正常' : '报警' }}</button>
  29. </view>
  30. </view>
  31. <view class="xiaItem">
  32. <text>热水阀</text>
  33. <text>{{formData.RSF}}%</text>
  34. </view>
  35. <view class="xiaItem">
  36. <text>高温报警</text>
  37. <view class="xiaBut">
  38. <button class="xiaButton" :class="{'Red_button': formData.GW_BJ == 1}">
  39. {{ formData.GW_BJ === '0' ? '正常' : '报警' }}</button>
  40. </view>
  41. </view>
  42. <view class="xiaItem">
  43. <text>缺风压差</text>
  44. <view class="xiaBut">
  45. <button class="xiaButton"
  46. :class="{'Red_button': formData.QFYC_BJ == 1}">{{ formData.QFYC_BJ === '0' ? '正常' : '报警' }}</button>
  47. </view>
  48. </view>
  49. <view class="xiaItem">
  50. <text>中效滤网</text>
  51. <view class="xiaBut">
  52. <button class="xiaButton"
  53. :class="{'Red_button': formData.LWDS_ZX == 1}">{{ formData.LWDS_ZX === '0' ? '正常' : '报警' }}</button>
  54. </view>
  55. </view>
  56. </view>
  57. </view>
  58. <view class="hold">
  59. <view class="tiao">
  60. <text class="tiaoText">CK-1</text>
  61. </view>
  62. <view class="param">
  63. <view class="paramItem">
  64. <text class="name">温度</text>
  65. <text class="value">{{formData.WD_1}}℃</text>
  66. </view>
  67. <view class="paramItem">
  68. <text class="name">湿度</text>
  69. <text class="value">{{formData.SD_1}}%</text>
  70. </view>
  71. <view class="paramItem">
  72. <text class="name">含湿量</text>
  73. <text class="value">{{formData.HSL}}g/kg</text>
  74. </view>
  75. </view>
  76. </view>
  77. <view class="hold">
  78. <view class="tiao">
  79. <text class="tiaoText">CK-2</text>
  80. </view>
  81. <view class="param">
  82. <view class="paramItem">
  83. <text class="name">温度</text>
  84. <text class="value">{{formData.WD_2}}℃</text>
  85. </view>
  86. <view class="paramItem">
  87. <text class="name">湿度</text>
  88. <text class="value">{{formData.SD_2}}%</text>
  89. </view>
  90. <view class="paramItem">
  91. <text class="name">含湿量</text>
  92. <text class="value">无g/kg</text>
  93. </view>
  94. </view>
  95. </view>
  96. <view class="stop">
  97. <view class="stopTiao">
  98. <text class="stopTiaoText">停机延时:{{formData.JZ_YSTZ}}s</text>
  99. </view>
  100. <view class="param">
  101. <view class="paramItem1">
  102. <text class="name1">排风温度设定</text>
  103. <text class="value">{{formData.WD_SD}}℃</text>
  104. </view>
  105. <view class="paramItem1">
  106. <text class="name1">排风湿度设定</text>
  107. <text class="value">{{formData.SD_SD}}%</text>
  108. </view>
  109. <view class="paramItem1">
  110. <text class="name1">排风含湿量设定</text>
  111. <text class="value">{{formData.HSL_SD}}g/kg</text>
  112. </view>
  113. </view>
  114. </view>
  115. <view class="stopButton">
  116. <button class="Green_button" @tap="stopAndStart" :class="{'Red_button': formData.JZ_KGJ == 0}">开关按钮</button>
  117. </view>
  118. <view class="anniu" @tap="back">
  119. <image class="anniu" src="../../static/设备菜单/前往列表@2x.png"></image>
  120. </view>
  121. </view>
  122. </template>
  123. <script>
  124. export default {
  125. data() {
  126. return {
  127. deviceParams: [],
  128. formData: {
  129. RSF: '',
  130. LSF: '',
  131. JSF: '',
  132. sn: 'CK1',
  133. WD_1: '',
  134. SD_1: '',
  135. WD_2: '',
  136. SD_2: '',
  137. WD_SD: '',
  138. SD_SD: '',
  139. HSL: '',
  140. HSL_SD: '',
  141. JZ_YSTZ: '',
  142. Id: '',
  143. code: '',
  144. GW_BJ: '0', //高温报警(0:正常,1:报警)
  145. QFYC_BJ: '1', //缺风压差(0:正常,1:报警)
  146. LWDS_CX: '0', //初效故障报警(0:正常,1:故障)
  147. LWDS_ZX: '1', //中效故障报警(0:正常,1:故障)
  148. YJDJR_QT: '', //一级电加热启停(0:停止,1:启动)
  149. EJDJR_QT: '', //二级电加热启停(0:停止,1:启动)
  150. SJDJR_QT: '', //三级电加热启停(0:停止,1:启动)
  151. JZ_KGJ: '', //设备开关机(0:停止,1:启动)
  152. }
  153. }
  154. },
  155. onLoad(e) {
  156. this.getWD_1()
  157. this.getSD_1()
  158. this.getHSL()
  159. this.getWD_2()
  160. this.getSD_2()
  161. this.getYSTZ()
  162. this.getWD_SD()
  163. this.getSD_SD()
  164. this.getHSL_SD()
  165. this.getRSF()
  166. this.getLSF()
  167. this.getJSF()
  168. this.getGWBJ()
  169. this.getQFYC()
  170. this.getCXLW()
  171. this.getZXLW()
  172. this.getYJDJR()
  173. this.getEJDJR()
  174. this.getSJDJR()
  175. this.getJZ_KGJ()
  176. },
  177. methods: {
  178. back() {
  179. uni.navigateTo({
  180. url: '/pages/device/deviceInfo/deviceInfo'
  181. })
  182. },
  183. async list(e) {
  184. let vm = this;
  185. let url = uni.$api.deviceParam.list;
  186. let data = {
  187. sn: this.formData.sn,
  188. };
  189. let res = await uni.$http.get(url);
  190. this.deviceParams = res.data.data.deviceParams;
  191. console.log(res.data.data.deviceParams);
  192. },
  193. async getWD_1(e) {
  194. let vm = this;
  195. let url = uni.$api.deviceParam.detail;
  196. let data = {
  197. id: "207",
  198. };
  199. let res = await uni.$http.get(url, data);
  200. this.formData.WD_1 = res.data.data.deviceParam.value;
  201. console.log(this.formData.WD_1);
  202. },
  203. async getSD_1(e) {
  204. let vm = this;
  205. let url = uni.$api.deviceParam.detail;
  206. let data = {
  207. id: "293",
  208. };
  209. let res = await uni.$http.get(url, data);
  210. this.formData.SD_1 = res.data.data.deviceParam.value;
  211. console.log(this.formData.SD_1);
  212. },
  213. async getHSL(e) {
  214. let vm = this;
  215. let url = uni.$api.deviceParam.detail;
  216. let data = {
  217. id: "269",
  218. };
  219. let res = await uni.$http.get(url, data);
  220. this.formData.HSL = res.data.data.deviceParam.value;
  221. console.log(this.formData.HSL);
  222. },
  223. async getWD_2(e) {
  224. let vm = this;
  225. let url = uni.$api.deviceParam.detail;
  226. let data = {
  227. id: "308",
  228. };
  229. let res = await uni.$http.get(url, data);
  230. this.formData.WD_2 = res.data.data.deviceParam.value;
  231. console.log(this.formData.WD_2);
  232. },
  233. async getSD_2(e) {
  234. let vm = this;
  235. let url = uni.$api.deviceParam.detail;
  236. let data = {
  237. id: "309",
  238. };
  239. let res = await uni.$http.get(url, data);
  240. this.formData.SD_2 = res.data.data.deviceParam.value;
  241. console.log(this.formData.SD_2);
  242. },
  243. async getYSTZ(e) {
  244. let vm = this;
  245. let url = uni.$api.deviceParam.detail;
  246. let data = {
  247. id: "219",
  248. };
  249. let res = await uni.$http.get(url, data);
  250. this.formData.JZ_YSTZ = res.data.data.deviceParam.value;
  251. console.log(this.formData.JZ_YSTZ);
  252. },
  253. async getWD_SD(e) {
  254. let vm = this;
  255. let url = uni.$api.deviceParam.detail;
  256. let data = {
  257. id: "296",
  258. };
  259. let res = await uni.$http.get(url, data);
  260. this.formData.WD_SD = res.data.data.deviceParam.value;
  261. console.log(this.formData.WD_SD);
  262. },
  263. async getSD_SD(e) {
  264. let vm = this;
  265. let url = uni.$api.deviceParam.detail;
  266. let data = {
  267. id: "231",
  268. };
  269. let res = await uni.$http.get(url, data);
  270. this.formData.SD_SD = res.data.data.deviceParam.value;
  271. console.log(this.formData.SD_SD);
  272. },
  273. async getHSL_SD(e) {
  274. let vm = this;
  275. let url = uni.$api.deviceParam.detail;
  276. let data = {
  277. id: "227",
  278. };
  279. let res = await uni.$http.get(url, data);
  280. this.formData.HSL_SD = res.data.data.deviceParam.value;
  281. console.log(this.formData.HSL_SD);
  282. },
  283. async getRSF(e) {
  284. let vm = this;
  285. let url = uni.$api.deviceParam.detail;
  286. let data = {
  287. id: "216",
  288. };
  289. let res = await uni.$http.get(url, data);
  290. this.formData.RSF = res.data.data.deviceParam.value;
  291. console.log(this.formData.RSF);
  292. },
  293. async getLSF(e) {
  294. let vm = this;
  295. let url = uni.$api.deviceParam.detail;
  296. let data = {
  297. id: "268",
  298. };
  299. let res = await uni.$http.get(url, data);
  300. this.formData.LSF = res.data.data.deviceParam.value;
  301. console.log(this.formData.LSF);
  302. },
  303. async getJSF(e) {
  304. let vm = this;
  305. let url = uni.$api.deviceParam.detail;
  306. let data = {
  307. id: "212",
  308. };
  309. let res = await uni.$http.get(url, data);
  310. this.formData.JSF = res.data.data.deviceParam.value;
  311. console.log(this.formData.JSF);
  312. },
  313. async getGWBJ(e) {
  314. let vm = this;
  315. let url = uni.$api.deviceParam.detail;
  316. let data = {
  317. id: "294",
  318. };
  319. let res = await uni.$http.get(url, data);
  320. this.formData.GW_BJ = res.data.data.deviceParam.value;
  321. },
  322. async getQFYC(e) {
  323. let vm = this;
  324. let url = uni.$api.deviceParam.detail;
  325. let data = {
  326. id: "306",
  327. };
  328. let res = await uni.$http.get(url, data);
  329. this.formData.QFYC_BJ = res.data.data.deviceParam.value;
  330. },
  331. async getCXLW(e) {
  332. let vm = this;
  333. let url = uni.$api.deviceParam.detail;
  334. let data = {
  335. id: "283",
  336. };
  337. let res = await uni.$http.get(url, data);
  338. this.formData.LWDS_CX = res.data.data.deviceParam.value;
  339. },
  340. async getZXLW(e) {
  341. let vm = this;
  342. let url = uni.$api.deviceParam.detail;
  343. let data = {
  344. id: "303",
  345. };
  346. let res = await uni.$http.get(url, data);
  347. this.formData.LWDS_ZX = res.data.data.deviceParam.value;
  348. },
  349. async getYJDJR(e) {
  350. let vm = this;
  351. let url = uni.$api.deviceParam.detail;
  352. let data = {
  353. id: "215",
  354. };
  355. let res = await uni.$http.get(url, data);
  356. this.formData.YJDJR_QT = res.data.data.deviceParam.value;
  357. },
  358. async getEJDJR(e) {
  359. let vm = this;
  360. let url = uni.$api.deviceParam.detail;
  361. let data = {
  362. id: "211",
  363. };
  364. let res = await uni.$http.get(url, data);
  365. this.formData.EJDJR_QT = res.data.data.deviceParam.value;
  366. },
  367. async getSJDJR(e) {
  368. let vm = this;
  369. let url = uni.$api.deviceParam.detail;
  370. let data = {
  371. id: "213",
  372. };
  373. let res = await uni.$http.get(url, data);
  374. this.formData.SJDJR_QT = res.data.data.deviceParam.value;
  375. },
  376. async getJZ_KGJ(e) {
  377. let vm = this;
  378. let url = uni.$api.deviceParam.detail;
  379. let data = {
  380. id: "267",
  381. };
  382. let res = await uni.$http.get(url, data);
  383. this.formData.JZ_KGJ = res.data.data.deviceParam.value;
  384. },
  385. async stopAndStart(e) {
  386. this.formData.JZ_KGJ == 1 ? this.formData.JZ_KGJ = 0 : this.formData.JZ_KGJ = 1;
  387. let vm = this;
  388. let url = uni.$api.deviceParam.updateParam;
  389. let data = {
  390. id: "267",
  391. value: this.formData.JZ_KGJ,
  392. name: "JZ_KGJ",
  393. sn: "CK1"
  394. };
  395. let res = await uni.$http.get(url, data);
  396. console.log(res.data.data.value);
  397. }
  398. }
  399. }
  400. </script>
  401. <style>
  402. .anniu {
  403. width: 116rpx;
  404. height: 116rpx;
  405. float: right;
  406. margin-right: 10rpx;
  407. }
  408. .Green_button {
  409. background-color: mediumspringgreen;
  410. color: white;
  411. width: 654rpx;
  412. margin-left: 48rpx;
  413. margin-top: 44rpx;
  414. }
  415. .Red_button {
  416. background-color: crimson;
  417. color: white;
  418. }
  419. .name1 {
  420. color: #848586;
  421. font-size: 24rpx;
  422. }
  423. .name {
  424. color: #848586;
  425. font-size: 30rpx;
  426. }
  427. .value {
  428. font-size: 38rpx;
  429. color: #444546;
  430. }
  431. .paramItem {
  432. display: flex;
  433. flex-direction: column;
  434. margin-left: 58rpx;
  435. margin-right: 46rpx;
  436. }
  437. .paramItem1 {
  438. display: flex;
  439. flex-direction: column;
  440. margin-left: 40rpx;
  441. margin-right: 40rpx;
  442. }
  443. .param {
  444. display: flex;
  445. flex-direction: row;
  446. margin-left: 24rpx;
  447. align-items: center;
  448. justify-content: center;
  449. width: 702rpx;
  450. height: 140rpx;
  451. background-color: white;
  452. border-bottom-right-radius: 8rpx;
  453. border-bottom-left-radius: 8rpx;
  454. }
  455. .tiaoText {
  456. margin-left: 44rpx;
  457. font-size: 34rpx;
  458. font-weight: 550;
  459. }
  460. .stopTiaoText {
  461. margin-left: 44rpx;
  462. font-size: 36rpx;
  463. font-weight: 550;
  464. }
  465. .tiao {
  466. margin-top: 26rpx;
  467. border-top-left-radius: 8rpx;
  468. border-top-right-radius: 8rpx;
  469. margin-left: 24rpx;
  470. width: 702rpx;
  471. height: 60px;
  472. background: #EAF1FE;
  473. font-size: 30rpx;
  474. color: #007AFF;
  475. display: flex;
  476. align-items: center;
  477. }
  478. .stopTiao {
  479. margin-top: 26rpx;
  480. border-top-left-radius: 8rpx;
  481. border-top-right-radius: 8rpx;
  482. margin-left: 24rpx;
  483. width: 702rpx;
  484. height: 60px;
  485. background: #007AFF;
  486. font-size: 38rpx;
  487. color: white;
  488. display: flex;
  489. align-items: center;
  490. }
  491. .xia {
  492. display: flex;
  493. flex-direction: row;
  494. }
  495. .xiaItem {
  496. color: white;
  497. display: flex;
  498. flex-direction: column;
  499. margin-left: 20rpx;
  500. margin-right: 20rpx;
  501. align-items: center;
  502. justify-content: center;
  503. margin-bottom: 16rpx;
  504. }
  505. .shang {
  506. display: flex;
  507. flex-direction: row;
  508. }
  509. .shangItem {
  510. color: white;
  511. display: flex;
  512. flex-direction: column;
  513. margin-left: 30rpx;
  514. margin-right: 30rpx;
  515. align-items: center;
  516. justify-content: center;
  517. margin-bottom: 16rpx;
  518. }
  519. .buttonItem {
  520. display: flex;
  521. flex-direction: row;
  522. font-size: 20rpx;
  523. color: #444546;
  524. }
  525. .but {
  526. width: 50rpx;
  527. height: 50rpx;
  528. display: flex;
  529. align-items: center;
  530. justify-content: center;
  531. margin-left: 10rpx;
  532. margin-top: 5rpx;
  533. font-size: 24rpx;
  534. }
  535. .active-but {
  536. background-color: #00ff99;
  537. }
  538. .xiaBut {
  539. display: flex;
  540. flex-direction: row;
  541. font-size: 20rpx;
  542. color: #444546;
  543. }
  544. .KGJ_button {
  545. background-color: #00ff99;
  546. }
  547. .xiaButton {
  548. width: 100rpx;
  549. height: 50rpx;
  550. display: flex;
  551. align-items: center;
  552. justify-content: center;
  553. margin-left: 10rpx;
  554. margin-top: 5rpx;
  555. font-size: 24rpx;
  556. }
  557. .head {
  558. font-size: 26rpx;
  559. height: 300px;
  560. background: linear-gradient(180deg, #2A8FFB 0%, #0467FB 100%);
  561. display: flex;
  562. flex-direction: column;
  563. align-items: center;
  564. justify-content: center;
  565. }
  566. .comp {
  567. background-color: #D6D6D6;
  568. width: 702rpx;
  569. height: 200rpx;
  570. border-radius: 8rpx;
  571. margin-bottom: 20rpx;
  572. }
  573. </style>