device-port.html 40 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="Cache-Control" content="no-cache,no-store,no-siteapp,must-revalidate">
  6. <meta http-equiv="pragma" content="no-cache">
  7. <meta http-equiv="expires" content="0">
  8. <meta name="author" content="">
  9. <meta name="description" content=""/>
  10. <meta name="keywords" content="扫码支付,线上投币,运营数据,物联网"/>
  11. <meta name="format-detection" content="telephone=no,email=no">
  12. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
  13. <title>端口管理</title>
  14. <link rel="stylesheet" href="https://cdn.washpayer.com/components/lib/mui.min.css">
  15. <link rel="stylesheet" href="../components/custom/css/common.css">
  16. <link rel="stylesheet" href="css/xyf.common.min.css">
  17. <style>
  18. .oper-btn {
  19. margin-right: -5px;
  20. }
  21. .port-head {
  22. width: 100%;
  23. }
  24. .port-info {
  25. float: left;
  26. width: 50%;
  27. overflow: hidden;
  28. white-space: nowrap;
  29. text-overflow: ellipsis;
  30. }
  31. .mui-table-view-cell:after{
  32. left: 0;
  33. }
  34. .order-info,.order-info-loading {
  35. background: #fafafb;
  36. position: relative;
  37. padding: 6px;
  38. margin: 8px 0;
  39. }
  40. .p-title{
  41. }
  42. .power-graph-box {
  43. background: #fff;
  44. width: 100%;
  45. height: 220px;
  46. padding: 0;
  47. }
  48. .chart-box {
  49. background: #fff;
  50. width: 100%;
  51. height: 220px;
  52. }
  53. </style>
  54. </head>
  55. <body class="">
  56. <h4 class="param-title" id="device">设备</h4>
  57. <div class="mui-input-group mui-control-content mui-active" id="portPanel">
  58. </div>
  59. <!--生成二维码-->
  60. <div class="common-mask" id="codePanel">
  61. <div class="common-model">
  62. <div class="common-model-tit">长按二维码保存
  63. </div>
  64. <img id="previewImg" style="margin: auto;display: block">
  65. <div class="common-model-close" onclick="closeQRCode()">关闭</div>
  66. </div>
  67. </div>
  68. <div class="common-mask" id="showPG">
  69. <div class="common-model">
  70. <div class="common-model-tit" id="pgTitle">数据获取中...</div>
  71. <div class="power-graph-box chart-box" id="powerGraph"></div>
  72. <div class="common-model-close" onclick="closePG()">关闭</div>
  73. </div>
  74. </div>
  75. <!--没有操作按钮-->
  76. <script type="text/html" id="modal100201">
  77. <div class="mui-table-view-cell">
  78. <div class="port-head">
  79. <span class="port-name"></span>
  80. </div>
  81. </div>
  82. </script>
  83. <!--有停止、启用、禁用-->
  84. <script type="text/html" id="modal100202">
  85. <div class="mui-table-view-cell">
  86. <div class="port-head">
  87. <span class="port-name"></span>
  88. <span data-id="33" class="mui-pull-right oper-btn font-b-8" permission="manage-show">
  89. <em onclick="stopPort()" class="padding-5 stopPort mui-hidden"><i
  90. class="iconfont icon-close-dark font-18 c-lgreen"></i><i
  91. class="">停止</i></em>
  92. <em onclick="activePort()" class="padding-5 activePort"><i class="iconfont icon-fault font-16 "></i><i
  93. class="word"> 禁用</i></em>
  94. </span>
  95. </div>
  96. </div>
  97. </script>
  98. <!--只有停止-->
  99. <script type="text/html" id="modal100203">
  100. <div class="mui-table-view-cell">
  101. <div class="port-head">
  102. <span class="port-name"></span>
  103. <span data-id="33" class="mui-pull-right oper-btn font-b-8" permission="manage-show">
  104. <em onclick="stopPort()" class="padding-5 stopPort mui-hidden"><i
  105. class="iconfont icon-close-dark font-18 c-lgreen"></i><i
  106. class="">停止</i></em>
  107. </span>
  108. </div>
  109. </div>
  110. </script>
  111. <!--100805的充电柜 可以直接进行开锁的-->
  112. <script type="text/html" id="modal100805">
  113. <div class="mui-table-view-cell">
  114. <div class="port-head">
  115. <span class="port-name"></span>
  116. <span data-id="33" class="mui-pull-right oper-btn font-b-8" permission="manage-show">
  117. <em onclick="unlockPort()" class="padding-5 stopPort "><i
  118. class="iconfont icon-unlock font-18 c-red"></i><i
  119. class=""> 开锁</i></em>
  120. </span>
  121. </div>
  122. </div>
  123. </script>
  124. <!--换电柜 直接启动给电池充电-->
  125. <script type="text/html" id="modal100230">
  126. <div class="mui-table-view-cell">
  127. <div class="port-head">
  128. <span class="port-name"></span>
  129. <span data-id="33" class="mui-pull-right oper-btn font-b-8" permission="manage-show">
  130. <em onclick="activePort()" class="padding-5 activePort">
  131. <i class="iconfont icon-fault font-16 "></i>
  132. <i class="word"> 禁用</i>
  133. </em>
  134. <em onclick="chargePort()" class="padding-5 chargePort">
  135. <i class="iconfont icon-start font-16 c-green"></i>
  136. <i class=""> 充电</i>
  137. </em>
  138. </span>
  139. </div>
  140. </div>
  141. </script>
  142. <div id="stopTypeMenu" class="mui-popover mui-popover-action mui-popover-bottom">
  143. <ul class="mui-table-view">
  144. <li class="mui-table-view-cell" onclick="confirmStop('dealerStopUsingPort')">
  145. <div class='mui-navigate-right'><span>管理员停止端口</span></div>
  146. </li>
  147. <li class="mui-table-view-cell" onclick="confirmStop('dealerCancelOrder')">
  148. <div class='mui-navigate-right'><span>管理员取消订单</span></div>
  149. </li>
  150. <li class="mui-table-view-cell" onclick="confirmStop('illegalUseStop')">
  151. <div class='mui-navigate-right'><span>违规使用停止</span></div>
  152. </li>
  153. <li class="mui-table-view-cell" onclick="confirmStop('packageMismatchStop')">
  154. <div class='mui-navigate-right'><span>套餐不符停止</span></div>
  155. </li>
  156. </ul>
  157. </div>
  158. <script src="https://cdn.washpayer.com/components/lib/jquery.min.js"></script>
  159. <script src="../components/lib/jquery.qrcode.min.js"></script>
  160. <script src="../components/lib/echarts.js"></script>
  161. <script src="https://cdn.washpayer.com/components/lib/moment.min.js"></script>
  162. <script src="https://cdn.washpayer.com/components/lib/mui.min.js"></script>
  163. <script src="/components/custom/js/common.js"></script>
  164. <script src="js/xyf.common.js"></script>
  165. <script src="js/device-features.js"></script>
  166. <script>
  167. var logicalCode = getQueryString("logicalCode");
  168. var code = getQueryString("code");
  169. var type = getQueryString("type");
  170. $("#device").html("<i class='c-primary iconfont " + getDevIconName(type) + "'></i> " + type + logicalCode + '的端口');
  171. var portListUrl = "/dealer/getDevicePort"
  172. if (code === "100206" || code === "100202"|| code === "100256"|| code === "101206" || code === "102256" || code === "103210") {
  173. portListUrl = "/dealer/getPortsInfo"
  174. }
  175. //获取 设备功能设置
  176. sendRequest({
  177. url: portListUrl,
  178. type: "GET",
  179. data: {logicalCode: logicalCode},
  180. mask: "正在获取端口信息...",
  181. success: function (response) {
  182. if (response.result == 1) {
  183. var payload = response.payload;
  184. if (payload.isManager || payload.isManager == null) {
  185. $("body").attr("role", "manage");
  186. } else {
  187. $("body").attr("role", "limit-user");
  188. }
  189. var portList = payload.portList;
  190. if (portList.length > 0) {
  191. for (var index in portList) {
  192. var port = portList[index];
  193. if (code) {
  194. setNodeData(code, port);
  195. }
  196. }
  197. }
  198. } else {
  199. mui.toast(response.description);
  200. }
  201. }
  202. });
  203. function loadOnePort(dom, portConfig, port) {
  204. sendRequest({
  205. url: "/dealer/getDevicePortDetail",
  206. type: "GET",
  207. data: {logicalCode: logicalCode, portIndex: port.index},
  208. mask: "正在获取端口详细信息...",
  209. success: function (response) {
  210. if (response.result === 1) {
  211. var payload = response.payload;
  212. renderPortDetail(dom, portConfig, payload)
  213. } else {
  214. mui.toast(response.description);
  215. }
  216. }
  217. });
  218. }
  219. function getPortStatusDom(status) {
  220. var statusMap = {
  221. // 这三个状态根据配置来确定是否可用
  222. idle: {
  223. name: '空闲',
  224. style: 'c-success'
  225. },
  226. busy: {
  227. name: '繁忙',
  228. style: 'c-lgreen'
  229. },
  230. finished: {
  231. name: '完成',
  232. style: 'c-success'
  233. },
  234. connected: {
  235. name: '连接',
  236. style: 'c-lgreen'
  237. },
  238. // 以下两个状态 完全不能用
  239. fault: {
  240. name: '故障',
  241. style: 'c-red'
  242. },
  243. ban: {
  244. name: '禁用',
  245. style: 'font-4'
  246. },
  247. estop: {
  248. name: '急停状态',
  249. style: 'c-red'
  250. },
  251. ready: {
  252. name: '就绪',
  253. style: 'c-lgreen'
  254. },
  255. // 0:'空闲',
  256. // 1:'繁忙',
  257. // 2:'故障',
  258. // 3:'禁用',
  259. // 4:'暂停',
  260. // 5:'已连接',
  261. // 6:'充电完成',
  262. // 7:'维护中',
  263. // 8:'预约中',
  264. 0: {
  265. name: '空闲',
  266. style: 'c-success'
  267. },
  268. 1: {
  269. name: '繁忙',
  270. style: 'c-lgreen'
  271. },
  272. 2: {
  273. name: '故障',
  274. style: 'c-red'
  275. },
  276. 3: {
  277. name: '禁用',
  278. style: 'c-red'
  279. },
  280. 4: {
  281. name: '暂停',
  282. style: 'c-lgreen'
  283. },
  284. 5: {
  285. name: '已连接',
  286. style: 'c-success'
  287. },
  288. 6: {
  289. name: '充电完成',
  290. style: 'c-success'
  291. },
  292. 7: {
  293. name: '维护中',
  294. style: 'c-red'
  295. },
  296. 8: {
  297. name: '预约中',
  298. style: 'c-red'
  299. },
  300. 10: {
  301. name: '占位状态',
  302. style: 'c-lgreen'
  303. },
  304. 11: {
  305. name: '急停状态',
  306. style: 'c-red'
  307. },
  308. 12: {
  309. name: '就绪',
  310. style: 'c-success'
  311. },
  312. 13: {
  313. name: '继电器粘连',
  314. style: 'c-red'
  315. },
  316. }
  317. var item = statusMap[status]
  318. // 普通充电桩
  319. if (item) {
  320. return "<span class='" + item.style + "'>" + item.name + "</span>"
  321. } else {
  322. return "<span class='font-4'>未知</span>"
  323. }
  324. }
  325. function setNodeData(code, port) {
  326. var dom;
  327. // todo 缺少参数mcuVersion ,但目前的后台实现机制其实也用不上了
  328. var devFeatures = getDeviceFeatures({code: code});
  329. var portConfig = devFeatures.portConfig
  330. // 如果没有端口配置,说明没有操作按钮
  331. if (!portConfig) {
  332. dom = $($("#modal100201").html());
  333. } else if (portConfig.stop && portConfig.toggle) {
  334. dom = $($("#modal100202").html());
  335. var banBtn = '<i class="iconfont icon-fault font-16 c-red"></i><i class="word"> 禁用</i>';
  336. if (port.status == "busy") {
  337. dom.find(".stopPort").removeClass("mui-hidden");
  338. } else if (port.status == "fault" || port.status == "ban") {
  339. banBtn = '<i class="iconfont icon-start font-16 c-success"></i><i class="word"> 启用</i>';
  340. }
  341. //todo 停止|启动,似乎目前只有停止,不能远程启动?
  342. dom.find(".activePort").html(banBtn);
  343. } else if (portConfig.toggle && portConfig.charge) {
  344. dom = $($("#modal100230").html());
  345. if (port.status == "ban" || port.status == "fault"){
  346. var banBtn = '<i class="iconfont icon-start font-16 c-success"></i><i class="word"> 启用</i>';
  347. dom.find(".activePort").html(banBtn);
  348. }
  349. } else if (portConfig.toggle) {
  350. dom = $($("#modal100202").html());
  351. var banBtn = '<i class="iconfont icon-fault font-16 c-red"></i><i class="word"> 禁用</i>';
  352. if (port.status == "fault" || port.status == "ban") {
  353. banBtn = '<i class="iconfont icon-start font-16 c-success"></i><i class="word"> 启用</i>';
  354. }
  355. dom.find(".activePort").html(banBtn);
  356. } else if (portConfig.stop) {
  357. dom = $($("#modal100203").html());
  358. if (port.status == "busy" || port.status == "ready") {
  359. dom.find(".stopPort").removeClass("mui-hidden");
  360. } else {
  361. }
  362. } else if (portConfig.unlock) {
  363. dom = $($("#modal100805").html());
  364. }
  365. if (!dom) {
  366. return
  367. }
  368. //端口基本信息
  369. dom.find(".port-name").text("端口:" + port.index).append('<span class="margin-l-10 port-status"></span>');
  370. dom.attr("index", port.index);
  371. dom.attr("status", port.status);
  372. dom.find(".port-status").html(getPortStatusDom(port.status));
  373. $("#portPanel").append(dom);
  374. if (port.isLazy) {
  375. var loadingDom = $('<div class="order-info-loading mui-clearfix mui-navigate-right">' +
  376. ' <em class="padding-5 ">' +
  377. ' <i class="iconfont icon-eye font-18 c-blue"></i><i class="word"> 工作详情</i>' +
  378. ' </em></div>')
  379. loadingDom.on('click', function () {
  380. $(this).remove()
  381. loadOnePort(dom, portConfig, port)
  382. })
  383. dom.append(loadingDom)
  384. }
  385. renderPortDetail(dom, portConfig, port)
  386. }
  387. var gearMap = {
  388. 0: "第一档",
  389. 1: "第二档",
  390. 2: "第三档",
  391. 3: "第四档",
  392. 4: "第五档",
  393. }
  394. function renderPortDetail(dom, portConfig, port) {
  395. dom.find('.order-info,.port-foot').remove() // 先尝试清空旧的信息
  396. function getPayTypeEnum(item, type) {
  397. // 单位后台确定
  398. var payTypeEnum = {
  399. 'mobile': '扫码付费' + (item.coins || 0),
  400. 'mobile_vcard': '虚拟卡抵扣',
  401. 'monthlyPackage': '包月卡抵扣',
  402. 'coin': '投币' + (item.coins || 0),
  403. 'card': '刷卡' + (item.coins || 0),
  404. 'serverBilling': '后台计费',
  405. 'powerBilling': '功率计费',
  406. 'postpaid': '后付费',
  407. 'billAsServicePostpaid': '后付费',
  408. 'isFree': '免费时段',
  409. null: "未知"
  410. }
  411. return payTypeEnum[type]
  412. }
  413. var devDom = $('<div class="order-info mui-clearfix"><div class="font-14 p-title">设备详情</div></div>')
  414. var orderDom = $('<div class="order-info mui-clearfix"><div class="font-14 p-title">当前订单详情</div></div>')
  415. dom.append(devDom)
  416. dom.append(orderDom)
  417. // 公共字段,订单信息
  418. if (port.nickName) {
  419. orderDom.append('<p class="port-info no-alert margin-t-5 " onclick="goUser(\'' + (port.openId || '') + '\')"><span class="">用户昵称:</span><span class="c-success">' + port.nickName + '</span></p>')
  420. }
  421. if (port.cardNo) {
  422. orderDom.append('<p class="port-info no-alert margin-t-5 " onclick="goUserCard(\'' + (port.openId || '') + '\')"><span class="">卡号:</span><span class="c-success" >' + port.cardNo + '</span></p>')
  423. }
  424. if (port.cardName) {
  425. orderDom.append('<p class="port-info margin-t-5 "><span class="">卡名:</span><span class="c-success">' + port.cardName + '</span></p>')
  426. }
  427. if (port.pw != null) {
  428. orderDom.append('<p class="port-info margin-t-5 "><span class="">密码:</span><span class="c-success">' + port.pw + '</span></p>')
  429. }
  430. if (port.consumeType != null) {
  431. orderDom.append('<p class="port-info margin-t-5 "><span class="">消费:</span><span class="c-success">' + getPayTypeEnum(port,port.consumeType) + '</span></p>')
  432. }
  433. if (port.elecFee != null) {
  434. orderDom.append('<p class="port-info margin-t-5 "><span class="">电量费用:</span><span class="c-success">' + port.elecFee + '</span>元</p>')
  435. }
  436. if (port.serviceFee != null) {
  437. orderDom.append('<p class="port-info margin-t-5 "><span class="">服务费:</span><span class="c-success">' + port.serviceFee + '</span>元</p>')
  438. }
  439. if (port.statusErrorInfo != null) {
  440. orderDom.append('<p class="port-info margin-t-5 "><span class="">异常信息:</span><span class="c-red">' + port.statusErrorInfo + '</span></p>')
  441. }
  442. if (port.faultDesc != null) {
  443. devDom.append('<p class="port-info margin-t-5 "><span class="">故障描述:</span><span class="c-red">' + (port.faultDesc || '') + '</span></p>')
  444. }
  445. if (port.startTime != null) {
  446. orderDom.append('<p class="port-info margin-t-5 "><span class="">开始时间:</span><span class="c-success">' + (port.startTime) + '</span></p>')
  447. }
  448. if (port.needTime != null) {
  449. orderDom.append('<p class="port-info margin-t-5 "><span class="">订购时间:</span><span class="c-success">' + (port.needTime || 0) + '</span></p>')
  450. }
  451. if (port.actualNeedTime != null) {
  452. orderDom.append('<p class="port-info margin-t-5 "><span class="">实际预定时间:</span><span class="c-success">' + port.actualNeedTime + '</span>分钟</p>')
  453. }
  454. if (port.usedTime != null) {
  455. orderDom.append('<p class="port-info margin-t-5 "><span class="">已充时间:</span><span class="c-success">' + (port.usedTime || 0) + '</span>分钟</p>')
  456. }
  457. if (port.duration != null) {
  458. orderDom.append('<p class="port-info margin-t-5 "><span class="">充电时间:</span><span class="c-success">' + (port.duration || 0) + '</span>分钟</p>')
  459. }
  460. if (port.leftTime != null) {
  461. orderDom.append('<p class="port-info margin-t-5 "><span class="">剩余时间:</span><span class="c-success">' + (port.leftTime || 0) + '</span>分钟</p>')
  462. }
  463. if (port.occTime != null) {
  464. orderDom.append('<p class="port-info margin-t-5 "><span class="">占位时间:</span><span class="c-success">' + (port.occTime || 0) + '</span>分钟</p>')
  465. }
  466. if (port.allPayMoney != null) {
  467. orderDom.append('<p class="port-info margin-t-5 "><span class="">订单总金额:</span><span class="c-success">' + (port.allPayMoney || 0) + '</span></p>')
  468. }
  469. if (port.consumeMoney != null) {
  470. orderDom.append('<p class="port-info margin-t-5 "><span class="">已消费金额:</span><span class="c-success">' + (port.consumeMoney || 0) + '</span></p>')
  471. }
  472. if (port.chargedMoney != null) {
  473. orderDom.append('<p class="port-info margin-t-5 "><span class="">已充金额:</span><span class="c-success">' + (port.chargedMoney || 0) + '</span>元</p>')
  474. }
  475. if (port.leftMoney != null) {
  476. orderDom.append('<p class="port-info margin-t-5 "><span class="">本次消费余额:</span><span class="c-success">' + (port.leftMoney || 0) + '</span></p>')
  477. }
  478. if (port.leftElec != null) {
  479. orderDom.append('<p class="port-info margin-t-5 "><span class="">剩余电量:</span><span class="c-success">' + (port.leftElec || 0) + '</span>度</p>')
  480. }
  481. if (port.usedElec != null && port.usedElec !=0) {
  482. orderDom.append('<p class="port-info margin-t-5 "><span class="">已充入电量:</span><span class="c-success">' + (port.usedElec || 0) + '</span>度</p>')
  483. }
  484. if (port.elec != null) {
  485. orderDom.append('<p class="port-info margin-t-5 "><span class="">已充电量:</span><span class="c-success">' + (port.elec || 0) + '</span>度</p>')
  486. }
  487. if (port.needElec != null) {
  488. orderDom.append('<p class="port-info margin-t-5 "><span class="">订购电量:</span><span class="c-success">' + (port.needElec || 0) + '</span>度</p>')
  489. }
  490. if (port.cardConsumeMoney != null) {
  491. orderDom.append('<p class="port-info margin-t-5 "><span class="">本次刷卡已使用:</span><span class="c-success">' + (port.cardConsumeMoney || '') + '</span></p>')
  492. }
  493. if (port.lastPayMoney != null) {
  494. orderDom.append('<p class="port-info margin-t-5 "><span class="">单次刷卡金额:</span><span class="c-success">' + (port.lastPayMoney || '') + '</span></p>')
  495. }
  496. if (port.cardLeftMoney != null) {
  497. orderDom.append('<p class="port-info margin-t-5 "><span class="">本次刷卡剩余:</span><span class="c-success">' + (port.cardLeftMoney || '') + '</span></p>')
  498. }
  499. if (port.cardBalance) {
  500. orderDom.append('<p class="port-info margin-t-5 "><span class="">卡上余额:</span><span class="c-success">' + (port.cardBalance || '') + '</span></p>')
  501. }
  502. if (port.sequanceNo) {
  503. orderDom.append('<p class="port-info margin-t-5 "><span class="">流水号:</span><span class="c-success">' + (port.sequanceNo || '') + '</span></p>')
  504. }
  505. // 等待执行的订单
  506. if (port.waittingOrder && port.waittingOrder.length) {
  507. for (var index in port.waittingOrder) {
  508. var item = port.waittingOrder[index]
  509. var orderWaitDom = $('<div class="order-info mui-clearfix"><div class="font-14 p-title">等待执行订单' + (parseInt(index) + 1) + '</div></div>')
  510. dom.append(orderWaitDom)
  511. if (item.createTime != null) {
  512. orderWaitDom.append('<p class="port-info margin-t-5 "><span class="">创建时间:</span><span class="c-success">' + item.createTime + '</span></p>')
  513. }
  514. if (item.nickName != null) {
  515. orderWaitDom.append('<p class="port-info margin-t-5 "><span class="">用户昵称:</span><span class="c-success">' + item.nickName + '</span></p>')
  516. }
  517. if (item.consumeType != null) {
  518. orderWaitDom.append('<p class="port-info margin-t-5 "><span class="">消费:</span><span class="c-success">' + getPayTypeEnum(item, item.consumeType) + '</span></p>')
  519. }
  520. if (item.needTime != null) {
  521. orderWaitDom.append('<p class="port-info margin-t-5 "><span class="">订购时间:</span><span class="c-success">' + (item.needTime || 0) + '</span></p>')
  522. }
  523. if (item.needElec != null) {
  524. orderWaitDom.append('<p class="port-info margin-t-5 "><span class="">订购电量:</span><span class="c-success">' + (item.needElec || '') + '</span>度</p>')
  525. }
  526. if (item.cardNo != null) {
  527. orderWaitDom.append('<p class="port-info margin-t-5 "><span class="">卡号:</span><span class="c-success">' + item.cardNo + '</span></p>')
  528. }
  529. if (item.cardBalance != null) {
  530. orderWaitDom.append('<p class="port-info margin-t-5 "><span class="">卡上余额:</span><span class="c-success">' + item.cardBalance + '</span></p>')
  531. }
  532. }
  533. }
  534. let qiangStatusMap = {
  535. yes: '是',
  536. no: '否',
  537. unknow: '未知'
  538. }
  539. // 设备信息
  540. if (port.power != null) {
  541. devDom.append('<p class="port-info margin-t-5 "><span class="">功率:</span><span class="c-success">' + (port.power || 0) + '</span>瓦</p>')
  542. }
  543. if (port.STA != null) {
  544. devDom.append('<p class="port-info margin-t-5"><span>STA:</span><span class="c-success">' + (port.STA || '') + '</span></p>')
  545. }
  546. if (port.isPlugin != null) {
  547. devDom.append('<p class="port-info margin-t-5"><span>是否插枪:</span><span class="c-success">' + (qiangStatusMap[port.isPlugin] || '') + '</span></p>')
  548. }
  549. if (port.qiangGuiwei != null) {
  550. devDom.append('<p class="port-info margin-t-5"><span>枪是否归位:</span><span class="c-success">' + (qiangStatusMap[port.qiangGuiwei] || '') + '</span></p>')
  551. }
  552. if (port.electricity != null) {
  553. devDom.append('<p class="port-info margin-t-5 "><span class="">电流:</span><span class="c-success">' + (port.electricity || 0) + '</span>安</p>')
  554. }
  555. if (port.current != null) {
  556. devDom.append('<p class="port-info margin-t-5 "><span class="">电流:</span><span class="c-success">' + (port.current || 0) + '</span>安</p>')
  557. }
  558. if (port.ampere != null) {
  559. devDom.append('<p class="port-info margin-t-5 "><span class="">电流大小:</span><span class="c-success">' + (port.ampere || 0) + '</span>安</p>')
  560. }
  561. if (port.outputVoltage != null) {
  562. devDom.append('<p class="port-info margin-t-5 "><span class="">输出电压:</span><span class="c-success">' + (port.outputVoltage || 0) + '</span>伏</p>')
  563. }
  564. if (port.outputElec != null) {
  565. devDom.append('<p class="port-info margin-t-5 "><span class="">输出电流:</span><span class="c-success">' + (port.outputElec || 0) + '</span>安</p>')
  566. }
  567. if (port.chargeStatus != null) {
  568. devDom.append('<p class="port-info margin-t-5 "><span class="">充电状态:</span><span class="c-success">' + (port.chargeStatus || 0) + '</span></p>')
  569. }
  570. if (port.batteryVoltage != null) {
  571. devDom.append('<p class="port-info margin-t-5 "><span class="">电池电压:</span><span class="c-success">' + (port.batteryVoltage || 0) + '</span>伏</p>')
  572. }
  573. if (port.voltage != null) {
  574. devDom.append('<p class="port-info margin-t-5 "><span class="">电压:</span><span class="c-success">' + (port.voltage || 0) + '</span>伏</p>')
  575. }
  576. if (port.doorStatus != null) {
  577. devDom.append('<p class="port-info margin-t-5 "><span class="">柜门状态:</span><span class="c-success">' + (port.doorStatus || '') + '</span></p>')
  578. }
  579. if (port.batteryImei != null) {
  580. devDom.append('<p class="port-info margin-t-5 "><span class="">电池编号:</span><span class="c-success">' + (port.batteryImei || '') + '</span></p>')
  581. }
  582. if (port.devTemp != null) {
  583. devDom.append('<p class="port-info margin-t-5 "><span class="">充电桩芯片组温度:</span><span class="c-success">' + (port.devTemp || '') + '</span>℃</p>')
  584. }
  585. if (port.elecPoint != null) {
  586. devDom.append('<p class="port-info margin-t-5 "><span class="">电量百分比:</span><span class="c-success">' + (port.elecPoint || 0) + '</span></p>')
  587. }
  588. if (port.gear != null) {
  589. devDom.append('<p class="port-info margin-t-5 "><span class="">充电档位:</span><span class="c-success">' + (gearMap[port.gear]) + '</span></p>')
  590. }
  591. //公共的 2018.6.5 所有设备的端口都需要:扫码带端口号的二维码直接使用
  592. dom.append('<p class="port-foot mui-text-right margin-t-5">' +
  593. (port.showPG != null ? ('<span class="iconfont icon-chart-line c-green font-18 padding-10" style="vertical-align: -2px;" onclick="goPowerGraph(\'' + port.index + '\',' + '\'' + (port.startTime || '') + '\')"></span>') : '') +
  594. '<span class="iconfont icon-qrcode c-primary padding-10" onclick="getQRCode(\'' + port.index + '\')"></span>' +
  595. '</p>')
  596. if (portConfig && portConfig.param) {
  597. dom.append('<p class="port-foot padding-t-10 c-primary" onclick="goConfig(\'' + port.index + '\')"><i class="iconfont icon-setting"></i> 参数配置</p>')
  598. }
  599. // 隐藏不含信息的模块
  600. if (devDom.find('p.port-info').length === 0) {
  601. devDom.hide()
  602. }
  603. if (orderDom.find('p.port-info').length === 0) {
  604. orderDom.hide()
  605. }
  606. }
  607. var lastPort = null
  608. // 立马停止充电
  609. function stopPort() {
  610. var dom = $(event.target).closest(".mui-table-view-cell");
  611. lastPort = dom.attr("index");
  612. if (code == 110700) {
  613. mui('#stopTypeMenu').popover('toggle');
  614. return
  615. }
  616. confirmStop()
  617. }
  618. function confirmStop(type){
  619. var tit = "您确定要立即停止充电?";
  620. var btnArray = ['取消', '确定'];
  621. mui.confirm(tit, '温馨提示', btnArray, function (e) {
  622. if (e.index == 1) {
  623. sendRequest("/device/operDevicePort", "POST", {
  624. logicalCode: logicalCode,
  625. stop: true,
  626. type: type,
  627. portIndex: lastPort
  628. }, function (response) {
  629. if (response.result == 1) {
  630. mui.toast("操作成功");
  631. setTimeout(function () {
  632. window.location.reload();
  633. }, 1000);
  634. } else {
  635. mui.toast(response.description);
  636. }
  637. });
  638. }
  639. });
  640. }
  641. function unlockPort() {
  642. var dom = $(event.target).closest(".mui-table-view-cell");
  643. var index = dom.attr("index");
  644. var tit = "您确定要立即开锁?";
  645. var btnArray = ['取消', '确定'];
  646. mui.confirm(tit, '温馨提示', btnArray, function (e) {
  647. if (e.index == 1) {
  648. sendRequest("/device/unlockPort", "POST", {
  649. logicalCode: logicalCode,
  650. portIndex: index
  651. }, function (response) {
  652. if (response.result == 1) {
  653. mui.toast("操作成功");
  654. setTimeout(function () {
  655. window.location.reload();
  656. }, 1000);
  657. } else {
  658. mui.toast(response.description);
  659. }
  660. });
  661. }
  662. });
  663. }
  664. // 启动端口的充电
  665. function chargePort() {
  666. var dom = $(event.target).closest(".mui-table-view-cell");
  667. var index = dom.attr("index");
  668. var status = dom.attr("status");
  669. var chargePort = true;
  670. var tit = "";
  671. if (status === "idle") {
  672. tit = "确定启动该端口充电?";
  673. } else {
  674. tit = "确定停止该端口充电?";
  675. }
  676. var btnArray = ['取消', '确定'];
  677. mui.confirm(tit, '温馨提示', btnArray, function (e) {
  678. if (e.index == 1) {
  679. sendRequest(
  680. "/device/operDevicePort",
  681. "POST",
  682. {
  683. logicalCode: logicalCode,
  684. charge: chargePort,
  685. portIndex: index
  686. },
  687. function (response) {
  688. if (response.result == 1) {
  689. mui.toast("操作成功");
  690. // setTimeout(
  691. // function () {
  692. // window.location.reload();
  693. // },
  694. // 1000
  695. // );
  696. } else {
  697. mui.toast(response.description);
  698. }
  699. }
  700. );
  701. }
  702. });
  703. }
  704. // 启用或禁用充电端口
  705. function activePort() {
  706. var dom = $(event.target).closest(".mui-table-view-cell");
  707. var index = dom.attr("index");
  708. var status = dom.attr("status");
  709. var active = "";
  710. var tit = "";
  711. if (status == "ban" || status == "fault") {
  712. active = true;
  713. tit = "您确定要启用该端口?";
  714. } else {
  715. active = false;
  716. tit = "您确定要禁用该端口?";
  717. }
  718. var btnArray = ['取消', '确定'];
  719. mui.confirm(tit, '温馨提示', btnArray, function (e) {
  720. if (e.index == 1) {
  721. sendRequest("/device/operDevicePort", "POST", {
  722. logicalCode: logicalCode,
  723. active: active,
  724. portIndex: index
  725. }, function (response) {
  726. if (response.result == 1) {
  727. mui.toast("操作成功");
  728. setTimeout(function () {
  729. window.location.reload();
  730. }, 1000);
  731. } else {
  732. mui.toast(response.description);
  733. }
  734. });
  735. }
  736. });
  737. }
  738. //生成带端口号的二维码
  739. function getQRCode(index) {
  740. $("#codePanel").show();
  741. var protocol = location.protocol;
  742. if (logicalCode.indexOf('B') > -1) {
  743. protocol = "https:"
  744. }
  745. var currentDomain = protocol + "//" + location.host;
  746. var userUrl = currentDomain + "/userLogin?l=" + logicalCode + "&chargeIndex=" + index;
  747. var dataURL = getQRCodeImageData(userUrl, logicalCode + '-' + index);
  748. $("#previewImg").attr({
  749. "width": 200,
  750. "height": 230,
  751. "src": dataURL
  752. });
  753. }
  754. function goConfig(index) {
  755. var devFeatures = getDeviceFeatures({code: code});
  756. var portConfig = devFeatures.portConfig
  757. var url = portConfig.param;
  758. var option = {
  759. logicalCode: logicalCode,
  760. port: index,
  761. type: type,
  762. };
  763. if (url) {
  764. goPage(url, option);
  765. } else {
  766. mui.alert('该设备端口无法进行参数配置', '提示', '确定');
  767. }
  768. }
  769. function closeQRCode() {
  770. $("#codePanel").hide();
  771. }
  772. function goPowerGraph(index, startTime) {
  773. function powerChartOption(showCurrent, dataList) {
  774. var xData = [];
  775. var powerSeries = [];
  776. var voltageSeries = [];
  777. var currentSeries = [];
  778. for (var index in dataList) {
  779. let item = dataList[index]
  780. xData.push(moment(item.time).format("HH:mm"));
  781. powerSeries.push(parseFloat(item.power));
  782. voltageSeries.push(parseFloat(item.voltage));
  783. currentSeries.push(parseFloat(item.current));
  784. }
  785. var option = {
  786. grid: {
  787. x: 40,
  788. x2: 15,
  789. y: 45,
  790. y2: 40,
  791. },
  792. toolbox: {
  793. },
  794. tooltip: {
  795. trigger: 'axis',
  796. axisPointer: {
  797. lineStyle: {
  798. color: '#108EE9',
  799. width: .3,
  800. }
  801. }
  802. },
  803. legend: {
  804. data: ['功率']
  805. },
  806. xAxis: [{
  807. type: 'category',
  808. axisLabel: {
  809. textStyle: {
  810. color: "#aaa",
  811. fontSize: "12px"
  812. }
  813. },
  814. axisTick: {
  815. show: false,
  816. },
  817. axisLine: {
  818. show: false,
  819. },
  820. data: xData,
  821. min: 'dataMin',
  822. max: 'dataMax'
  823. }],
  824. yAxis: [
  825. {
  826. type: 'value',
  827. axisLabel: {
  828. textStyle: {
  829. color: "#aaa",
  830. fontSize: "12px"
  831. }
  832. },
  833. axisTick: {
  834. show: false,
  835. },
  836. axisLine: {
  837. show: false,
  838. },
  839. splitLine: {
  840. lineStyle: {
  841. color: '#ccc',
  842. width: 0.3,
  843. type: 'dotted'
  844. }
  845. },
  846. }
  847. ],
  848. series: [
  849. {
  850. name: '功率',
  851. type: 'line',
  852. itemStyle: {
  853. normal: {
  854. color: "#108EE9",
  855. }
  856. },
  857. data: powerSeries
  858. }
  859. ]
  860. };
  861. if (showCurrent == true) {
  862. option.legend.data = option.legend.data.concat(['电压', '电流'])
  863. option.series = option.series.concat([{
  864. name: '电压',
  865. type: 'line',
  866. itemStyle: {
  867. normal: {
  868. color: "#07C160",
  869. }
  870. },
  871. data: voltageSeries
  872. }, {
  873. name: '电流',
  874. type: 'line',
  875. itemStyle: {
  876. normal: {
  877. color: "#ED6066",
  878. }
  879. },
  880. data: currentSeries
  881. }])
  882. }
  883. return option
  884. }
  885. moment.locale('zh-cn');
  886. var _startTime = moment().subtract(8, 'hour').format("YYYY-MM-DD HH:mm:ss")
  887. var _endTime = moment().format("YYYY-MM-DD HH:mm:ss")
  888. if (startTime) {
  889. _startTime = moment(startTime.substr(-14, 14), 'MM-DD HH:mm:ss').subtract(4, 'hour').format("YYYY-MM-DD HH:mm:ss")
  890. }
  891. $("#showPG").show();
  892. $("#pgTitle").html('功率曲线( 端口: <em class="c-success">' + index + '</em> )' );
  893. var powerGraph = echarts.init(document.getElementById('powerGraph'));
  894. let url = '/common/getPowerGraph'
  895. sendRequest({
  896. url: url,
  897. type: "GET",
  898. data: {
  899. logicalCode: logicalCode,
  900. startTime: _startTime,
  901. endTime: _endTime,
  902. port: index
  903. },
  904. mask: "正在获取端口详细信息...",
  905. success: function (response) {
  906. if (response.result === 1) {
  907. var payload = response.payload;
  908. powerGraph.setOption(powerChartOption(0, payload.dataList))
  909. powerGraph.resize()
  910. } else {
  911. mui.toast(response.description);
  912. }
  913. }
  914. });
  915. }
  916. function closePG() {
  917. $("#showPG").hide();
  918. }
  919. function goUpper() {
  920. var url = "remote-upper.html";
  921. var option = {logicalCode: logicalCode,}
  922. goPage(url, option);
  923. }
  924. function goUser(openId) {
  925. if (openId) {
  926. var url = "/dealer/index.html#/user/detail?openId=" + openId
  927. goPage(url);
  928. }
  929. }
  930. function goUserCard(openId) {
  931. if (openId) {
  932. var url = "/app/card-manage.html?userId=" + openId
  933. goPage(url);
  934. }
  935. }
  936. // 点击字段看详情
  937. $(function () {
  938. $('body').on('click', '.port-info:not(".no-alert")', function () {
  939. mui.alert($(this).text())
  940. })
  941. })
  942. </script>
  943. </body>
  944. </html>