Device.html 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580
  1. <!DOCTYPE html>
  2. <html class="x-admin-sm">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="renderer" content="webkit">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  7. <meta name="viewport"
  8. content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
  9. <link rel="shortcut icon" href="/static/favicon.ico">
  10. <link rel="bookmark" href="/static/favicon.ico">
  11. <link rel="stylesheet" href="/static/css/font.css">
  12. <link rel="stylesheet" href="/static/css/xadmin.css">
  13. <link rel="stylesheet" href="/static/layui/css/modules/layer/default/layer.css">
  14. <link rel="stylesheet" href="/static/layui/css/modules/laydate/default/laydate.css">
  15. <script src="/static/js/jquery.min.js"></script>
  16. <script src="/static/lib/layui/layui.js" charset="utf-8"></script>
  17. <script src="/static/lib/layui/lay/modules/laydate.js"/>
  18. <script src="/static/lib/layui/lay/modules/layer.js" charset="utf-8"></script>
  19. <script type="text/javascript" src="/static/js/xadmin.js"></script>
  20. </head>
  21. <body>
  22. <div class="x-nav">
  23. <span class="layui-breadcrumb">
  24. <a href="">首页</a>
  25. <a><cite>设备管理</cite></a>
  26. </span>
  27. <a class="layui-btn layui-btn-normal" style="line-height:1.6em;margin-top:3px;float:right"
  28. onclick="location.reload()" title="刷新">
  29. <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
  30. </a>
  31. </div>
  32. <div class="layui-fluid">
  33. <div class="layui-row layui-col-space15">
  34. <div class="layui-col-md12">
  35. <div class="layui-card">
  36. <div class="layui-card-body ">
  37. <div class="layui-form layui-col-space5">
  38. <div class="layui-input-inline layui-show-xs-block">
  39. <input id="deviceName" type="text" name="Name"
  40. placeholder="设备名称/sn"
  41. autocomplete="off" class="layui-input"></div>
  42. <div class="layui-input-inline layui-show-xs-block">
  43. <select id="searchClass" value="0" class="layui-select">
  44. <option value="">所有分类</option>
  45. {{range $index, $elem := .Class_List}}
  46. <option value={{$elem.Id}}>{{$elem.T_name}}</option>
  47. {{end}}
  48. </select>
  49. </div>
  50. <div class="layui-input-inline layui-show-xs-block">
  51. <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="search"
  52. onclick="getDeviceDataList(1)">
  53. <i class="layui-icon">&#xe615;</i></button>
  54. </div>
  55. </div>
  56. </div>
  57. <!--数据列表部分-->
  58. <div class="layui-card-body " style="height: 663px">
  59. <table class="layui-table" lay-size="lg">
  60. <colgroup>
  61. <!-- <col width="20">-->
  62. <col>
  63. <col>
  64. <col>
  65. <col>
  66. </colgroup>
  67. <thead>
  68. <!-- <th>选择</th>-->
  69. <th>SN</th>
  70. <th>编号</th>
  71. <th>传感器名称</th>
  72. <th>操作</th>
  73. </thead>
  74. <tbody id="tableBody">
  75. </tbody>
  76. </table>
  77. </div>
  78. <div class="layui-card-body ">
  79. <div class="page">
  80. <div id="pageTool">
  81. <!--上一页-->
  82. </div>
  83. </div>
  84. </div>
  85. <!--设别列表部分end-->
  86. <div class="layui-card-body" style="justify-content: space-between;align-items: center;color: #ed3f35;height: 110px;">
  87. <h2 class="layui-col-md12">注意:</h2>
  88. <h3 class="layui-col-md12">1、修改参数 提示成功后,为了确保设备修改成功,请再次读取确定!!!</h3>
  89. <h3 class="layui-col-md12">2、此页面功能项目都属于敏感参数,没有修改记录!!!</h3>
  90. <h3 class="layui-col-md12">3、没有多选操作功能,因为修改以上参数必须设备在线与真实成功,为了可靠性,所以取消了多选操作功能!!!</h3>
  91. </div>
  92. <!--分页、选择区域 start-->
  93. <!-- <div class="layui-card-body" style="display: flex;justify-content: space-between;align-items: center">-->
  94. <!-- <div>-->
  95. <!-- <button class="layui-btn layui-btn-sm layui-btn-normal" id="selectAllBtn" onclick="selectAll()">-->
  96. <!-- 全选-->
  97. <!-- </button>-->
  98. <!-- <button class="layui-btn layui-btn-sm layui-btn-normal" onclick="reverseSelect()">反选</button>-->
  99. <!-- <button class="layui-btn layui-btn-sm layui-btn-normal" id="noSelectAllBtn"-->
  100. <!-- onclick="noSelect()">全不选-->
  101. <!-- </button>-->
  102. <!-- <button class="layui-btn layui-btn-sm layui-btn-normal" onclick="dataRepeat()">数据重传-->
  103. <!-- </button>-->
  104. <!-- <button class="layui-btn layui-btn-sm layui-btn-normal" onclick="deviation()">偏差值-->
  105. <!-- </button>-->
  106. <!-- </div>-->
  107. <!-- <div id="pageTool">-->
  108. <!-- &lt;!&ndash;上一页&ndash;&gt;-->
  109. <!-- </div>-->
  110. <!-- </div>-->
  111. <!-- 分页、选择区域 end -->
  112. </div>
  113. </div>
  114. </div>
  115. </div>
  116. <div id="deviation" style="display: none;margin-top: 20px;text-align: center">
  117. <form class="layui-form" lay-filter="dataRepeat" style="text-align: center">
  118. <div class="layui-form-item">
  119. <label class="layui-form-label">温度补偿:</label>
  120. <input type="text" id="wdbc" class="layui-input layui-input-inline"/>
  121. </div>
  122. <div class="layui-form-item">
  123. <label class="layui-form-label">湿度补偿: </label>
  124. <input type="text" id="sdbc" class="layui-input layui-input-inline"/>
  125. </div>
  126. </form>
  127. </div>
  128. <div id="Sensor" style="display: none;margin-top: 20px;text-align: center">
  129. <form class="layui-form" lay-filter="dataRepeat" style="text-align: center">
  130. <div class="layui-form-item">
  131. <label class="layui-form-label" style="width: 120px;">传感器采样率:</label>
  132. <input type="text" id="speed" class="layui-input layui-input-inline"/>
  133. <label class="layui-form-label" style="width: 120px;">s(1~240) 默认:15</label>
  134. </div>
  135. <div class="layui-form-item">
  136. <label class="layui-form-label" style="width: 120px;">传感器灵敏度:</label>
  137. <input type="text" id="sense" class="layui-input layui-input-inline"/>
  138. <label class="layui-form-label" style="width: 120px;">s(0~600) 默认:60 </label>
  139. </div>
  140. </form>
  141. </div>
  142. <div id="dataRepeat" style="display: none;margin-top: 20px;text-align: center">
  143. <form class="layui-form" lay-filter="dataRepeat">
  144. <div class="layui-form-item">
  145. <label class="layui-form-label">开始时间:</label>
  146. <input id="startTime" class="layui-input layui-input-inline" lay-key="1"/>
  147. </div>
  148. <div class="layui-form-item">
  149. <label class="layui-form-label">结束时间: </label>
  150. <input id="endTime" name="humidity" class="layui-input layui-input-inline" lay-key="2"/>
  151. </div>
  152. </form>
  153. </div>
  154. <script>
  155. //数据表格
  156. let pageInfo = null
  157. let currentPage = 1
  158. function getDeviceDataList(currentPage) {
  159. let searchDeviceName = $('#deviceName').val()
  160. let searchDeviceClass = $('#searchClass').val()
  161. console.log(searchDeviceName, searchDeviceClass)
  162. let formData = new FormData();
  163. formData.set('deviceName', searchDeviceName)
  164. formData.set('deviceClass', searchDeviceClass)
  165. formData.set('currentPage', currentPage)
  166. $.ajax({
  167. type: "POST",
  168. data: formData,
  169. contentType: false,
  170. processData: false,
  171. url: "/Device/DeviceList",
  172. success: function (result) {
  173. pageInfo = result
  174. let b = $('#tableBody')
  175. b.html("")
  176. if (result.list != null) {
  177. for (let v of result.list) {
  178. b.append(`
  179. <tr>
  180. <!-- <td><input type="checkbox" class="layui-form-checkbox" data-sn="${v.T_sn}" data-id="${v.T_id}"/></td>-->
  181. <td>${v.T_sn}</td>
  182. <td>${v.T_id}</td>
  183. <td>${v.T_name}</td>
  184. <td>
  185. <button onclick="deviation('${v.T_sn}','${v.T_id}')" class="layui-btn layui-btn-normal layui-btn-sm">偏差值</button>
  186. <button onclick="Sensor('${v.T_sn}','${v.T_id}')" class="layui-btn layui-btn-normal layui-btn-sm">传感器参数</button>
  187. <button onclick="dataRepeat('${v.T_sn}','${v.T_id}')" class="layui-btn layui-btn-normal layui-btn-sm">数据重传</button>
  188. </td>
  189. </tr>
  190. `)
  191. }
  192. } else {
  193. b.append(`<tr>
  194. <td colspan="5" rowspan="10" style="height: 590px;text-align: center">没有设备数据!</td>
  195. </tr>`)
  196. }
  197. //渲染分页
  198. $('#pageTool').html('')
  199. if (!pageInfo.previousPage) {
  200. $('#pageTool').append(`<button class="layui-btn layui-btn-primary layui-btn-sm " onclick="getDeviceDataList(${pageInfo.currentPage - 1})">上一页</button>`)
  201. } else {
  202. $('#pageTool').append(`<button class="layui-btn layui-btn-primary layui-btn-disabled layui-btn-sm" onclick="getDeviceDataList(${pageInfo.currentPage - 1})">上一页</button>`)
  203. }
  204. //页码
  205. let start, end
  206. start = pageInfo.currentPage - 2 <= 0 ? 1 : pageInfo.currentPage - 2
  207. end = pageInfo.currentPage + 2 >= pageInfo.totalPage ? pageInfo.totalPage : pageInfo.currentPage + 2
  208. end = end + (Math.abs(end - start)) >= pageInfo.totalPage ? pageInfo.totalPage : end + (Math.abs(end - start))
  209. start = start - (Math.abs(end - start)) <= 0 ? 1 : start - (Math.abs(end - start))
  210. for (; start <= end; start++) {
  211. if (pageInfo.currentPage == start) {
  212. $('#pageTool').append(`<button class="layui-btn layui-btn-disabled layui-btn-primary layui-btn-sm" onclick="getDeviceDataList(${start})">${start}</button>`)
  213. } else {
  214. $('#pageTool').append(`<button class="layui-btn layui-btn-primary layui-btn-sm" onclick="getDeviceDataList(${start})">${start}</button>`)
  215. }
  216. }
  217. if (!pageInfo.nextPage) {
  218. $('#pageTool').append(`<button class="layui-btn layui-btn-primary layui-btn-sm " onclick="getDeviceDataList(${pageInfo.currentPage + 1}">下一页</button>`)
  219. } else {
  220. $('#pageTool').append(`<button class="layui-btn layui-btn-primary layui-btn-disabled layui-btn-sm " onclick="getDeviceDataList( ${pageInfo.currentPage + 1} )">下一页</button>`)
  221. }
  222. }
  223. })
  224. }
  225. //偏差值
  226. function deviation(sn = '', id = '') {
  227. $('#wdbc').val("同步中...")
  228. $('#sdbc').val("同步中...")
  229. let selectSns = {}
  230. if (sn !== '' && id !== '') {
  231. selectSns[sn] = [parseInt(id)]
  232. }
  233. $('#tableBody > tr > td > input[type="checkbox"]').each((i, e) => {
  234. if ($(e).prop('checked')) {
  235. let sn = $(e).attr('data-sn')
  236. let id = parseInt($(e).attr('data-id'))
  237. if (selectSns[sn] === undefined) {
  238. selectSns[sn] = [id]
  239. } else {
  240. selectSns[sn].push(id)
  241. }
  242. $('#wdbc').val("")
  243. $('#sdbc').val("")
  244. }
  245. layui.layer.msg('请 确您勾选的设备 一定在线! 一定在线! 一定在线!,否则本次设置的参数可能无效!')
  246. })
  247. if (sn == null && selectSns.length == 0) {
  248. layui.layer.msg('没有可以操作的设备')
  249. return
  250. }
  251. let deviationData = [{}]
  252. console.log("选择数据:", selectSns)
  253. $.ajax({
  254. type: 'POST',
  255. url: '/Device/ReadDeviation',
  256. processData: false,
  257. contentType: "application/json",
  258. data: JSON.stringify(selectSns),
  259. success: function (rlt) {
  260. deviationData = []
  261. if (rlt.Code === 200) {
  262. if (rlt.Data.length === 1) {
  263. let t = JSON.parse(rlt.Data[0].split("||")[1])
  264. for(let i = 0; i < t.data.length; i++) {
  265. console.log(t.data[i]);
  266. if (t.data[i].id == id){
  267. $('#wdbc').val(t.data[i].t)
  268. $('#sdbc').val(t.data[i].h)
  269. deviationData.push({
  270. sn: sn,
  271. data: [{
  272. id: parseInt(t.data[i].id),
  273. h: t.data[i].h,
  274. t: t.data[i].t
  275. }]
  276. })
  277. }
  278. }
  279. } else {
  280. $('#wdbc').disabled()
  281. $('#sdbc').disabled()
  282. for (let v of rlt.Data) {
  283. let parameter = v.split("||");
  284. let sn = parameter[0].substring(parameter.lastIndex("/"))
  285. let t = JSON.parse(parameter[1])
  286. deviationData.push({
  287. sn: sn,
  288. data: [{
  289. id: parseInt(t.data[0].id),
  290. h: t.data[0].h,
  291. t: t.data[0].t
  292. }]
  293. })
  294. }
  295. }
  296. }
  297. // } else {
  298. // layui.layer.msg(rlt.Msg)
  299. // }
  300. }
  301. })
  302. layer.open({
  303. type: 1,
  304. title: '偏差值',
  305. area: ['400px', '230px'],
  306. content: $('#deviation'),
  307. btn: ['提交'],
  308. btnAlign: 'c',
  309. yes(index, elem) {
  310. console.log("偏差值数据:", deviationData)
  311. if (deviationData.length == 1) {
  312. deviationData[0].data[0].t = Number.parseFloat($('#wdbc').val())
  313. deviationData[0].data[0].h = Number.parseFloat($('#sdbc').val())
  314. }
  315. $.ajax({
  316. type: "POST",
  317. url: "/Device/WriteDeviation",
  318. contentType: "application/json",
  319. data: JSON.stringify(deviationData),
  320. processData: false,
  321. success: function (rlt) {
  322. layui.layer.msg(rlt.Msg)
  323. }
  324. })
  325. layui.layer.close(index)
  326. }
  327. })
  328. }
  329. //偏差值
  330. function Sensor(sn = '', id = '') {
  331. $('#speed').val("同步中...")
  332. $('#sense').val("同步中...")
  333. let selectSns = {}
  334. if (sn !== '' && id !== '') {
  335. selectSns[sn] = [parseInt(id)]
  336. }
  337. $('#tableBody > tr > td > input[type="checkbox"]').each((i, e) => {
  338. if ($(e).prop('checked')) {
  339. let sn = $(e).attr('data-sn')
  340. let id = parseInt($(e).attr('data-id'))
  341. if (selectSns[sn] === undefined) {
  342. selectSns[sn] = [id]
  343. } else {
  344. selectSns[sn].push(id)
  345. }
  346. $('#speed').val("")
  347. $('#sense').val("")
  348. }
  349. layui.layer.msg('请 确您勾选的设备 一定在线! 一定在线! 一定在线!,否则本次设置的参数可能无效!')
  350. })
  351. if (sn == null && selectSns.length == 0) {
  352. layui.layer.msg('没有可以操作的设备')
  353. return
  354. }
  355. let SensorData = [{}]
  356. console.log("选择数据:", selectSns)
  357. $.ajax({
  358. type: 'POST',
  359. url: '/Device/ReadSensor',
  360. processData: false,
  361. contentType: "application/json",
  362. data: JSON.stringify(selectSns),
  363. success: function (rlt) {
  364. SensorData = []
  365. if (rlt.Code === 200) {
  366. if (rlt.Data.length === 1) {
  367. let t = JSON.parse(rlt.Data[0].split("||")[1])
  368. for(let i = 0; i < t.data.length; i++) {
  369. console.log(t.data[i]);
  370. if (t.data[i].id == id){
  371. $('#speed').val(t.data[i].speed)
  372. $('#sense').val(t.data[i].sense)
  373. SensorData.push({
  374. sn: sn,
  375. data: [{
  376. id: parseInt(t.data[i].id),
  377. speed: t.data[i].speed,
  378. sense: t.data[i].sense
  379. }]
  380. })
  381. }
  382. }
  383. } else {
  384. $('#speed').disabled()
  385. $('#sense').disabled()
  386. for (let v of rlt.Data) {
  387. let parameter = v.split("||");
  388. let sn = parameter[0].substring(parameter.lastIndex("/"))
  389. let t = JSON.parse(parameter[1])
  390. SensorData.push({
  391. sn: sn,
  392. data: [{
  393. id: parseInt(t.data[0].id),
  394. speed: t.data[0].speed,
  395. sense: t.data[0].sense
  396. }]
  397. })
  398. }
  399. }
  400. }
  401. // } else {
  402. // layui.layer.msg(rlt.Msg)
  403. // }
  404. }
  405. })
  406. layer.open({
  407. type: 1,
  408. title: '传感器参数',
  409. area: ['500px', '230px'],
  410. content: $('#Sensor'),
  411. btn: ['提交'],
  412. btnAlign: 'c',
  413. yes(index, elem) {
  414. console.log("传感器参数:", SensorData)
  415. if (SensorData.length == 1) {
  416. SensorData[0].data[0].speed = Number.parseFloat($('#speed').val())
  417. SensorData[0].data[0].sense = Number.parseFloat($('#sense').val())
  418. }
  419. $.ajax({
  420. type: "POST",
  421. url: "/Device/WriteSensor",
  422. contentType: "application/json",
  423. data: JSON.stringify(SensorData),
  424. processData: false,
  425. success: function (rlt) {
  426. layui.layer.msg(rlt.Msg)
  427. }
  428. })
  429. layui.layer.close(index)
  430. }
  431. })
  432. }
  433. //数据重传
  434. function dataRepeat(sn, type) {
  435. let selectSns = {}
  436. $('#tableBody > tr > td > input[type="checkbox"]').each((i, e) => {
  437. if ($(e).prop('checked')) {
  438. let sn = $(e).attr('data-sn')
  439. let id = $(e).attr('data-id')
  440. if (selectSns[sn] === undefined) {
  441. selectSns[sn] = [id]
  442. } else {
  443. selectSns[sn].push(id)
  444. }
  445. }
  446. layui.layer.msg('请 确您勾选的设备 一定在线! 一定在线! 一定在线!,否则本次设置的参数可能无效!')
  447. })
  448. if (sn == null && selectSns.length === 0) {
  449. layui.layer.msg('没有可以操作的设备')
  450. return
  451. }
  452. let startTime, endTime;
  453. layui.layer.open({
  454. type: 1,
  455. title: '数据重传',
  456. area: ['400px', '230px'],
  457. content: $('#dataRepeat'),
  458. btn: ['提交'],
  459. btnAlign: 'c',
  460. yes(index, elem) {
  461. startTime = $("#startTime").val();
  462. endTime = $("#endTime").val();
  463. console.log(`开始时间:${startTime},结束时间:${endTime}`)
  464. if (startTime === '' || endTime === '') {
  465. layui.layer.msg('开始、结束时间不能为空')
  466. return
  467. }
  468. //如果sn存在则表示针对单个设备
  469. if (sn != null && sn != undefined) {
  470. selectSns = {}
  471. selectSns[sn] = [type]
  472. }
  473. $.ajax({
  474. type: 'POST',
  475. url: '/Device/DataRepeat',
  476. data: JSON.stringify({
  477. sns: selectSns,
  478. startTime: startTime,
  479. endTime: endTime
  480. }),
  481. contentType: "application/json;charset=utf-8",
  482. processData: false,
  483. success: function (rlt) {
  484. if (rlt.Code === 200) {
  485. //关闭窗口
  486. layui.layer.close(index)
  487. }
  488. layui.layer.msg(rlt.Msg)
  489. }
  490. })
  491. }
  492. });
  493. }
  494. //初始化日期的操作
  495. layui.use(['laydate', 'form', 'element'],
  496. function () {
  497. var laydate = layui.laydate;
  498. //执行一个laydate实例
  499. laydate.render({
  500. elem: '#startTime' //指定元素
  501. , type: 'datetime'
  502. });
  503. //执行一个laydate实例
  504. laydate.render({
  505. elem: '#endTime' //指定元素
  506. , type: 'datetime'
  507. });
  508. var element = layui.element;
  509. element.length = 30
  510. }
  511. );
  512. //全选
  513. let selectAllField = false
  514. function selectAll() {
  515. selectAllField = true
  516. $('#tableBody > tr > td > input[type="checkbox"]').each((i, e) => {
  517. $(e).prop('checked', true)
  518. })
  519. }
  520. //反选
  521. function reverseSelect() {
  522. $('#tableBody > tr > td > input[type="checkbox"]').each((i, e) => {
  523. $(e).prop('checked', !$(e).prop('checked'))
  524. })
  525. }
  526. //全不选
  527. function noSelect() {
  528. $('#tableBody > tr > td > input[type="checkbox"]').each((i, e) => {
  529. $(e).prop('checked', false)
  530. })
  531. }
  532. $(function () {
  533. getDeviceDataList(1) //获取数据列表
  534. })
  535. </script>
  536. </body>
  537. </html>