device-function-100239-faka.html 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  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="/app/css/xyf.common.min.css">
  17. <style>
  18. </style>
  19. </head>
  20. <body class="device-function">
  21. <h4 class="param-title" id="device">设备</h4>
  22. <!--发离线卡模式、离线卡密码修改模式、正常刷卡模式-->
  23. <form class="device-param-form" interfaceName="setCardMode" validate="validatePassword">
  24. <h5 class="mui-content-padded font-b-6 ">刷卡器工作模式</h5>
  25. <div class="mui-input-group">
  26. <div class="mui-input-row mui-radio">
  27. <label for="card_mode0">正常刷卡模式</label>
  28. <input id="card_mode0" class="save-data" name="card_mode" value="0" type="radio">
  29. </div>
  30. <div class="mui-input-row mui-radio">
  31. <label for="card_mode1">发离线卡模式</label>
  32. <input id="card_mode1" name="card_mode" value="1" type="radio">
  33. </div>
  34. <div class="mui-input-row mui-radio">
  35. <label for="card_mode2">离线卡密码修改模式</label>
  36. <input id="card_mode2" class="save-data" name="card_mode" value="2" type="radio">
  37. </div>
  38. </div>
  39. <div class="passGroupRow">
  40. <h5 class="mui-content-padded font-b-6">请输入如下参数</h5>
  41. <div class="mui-input-group">
  42. <div class="mui-input-row" id="oldPwdRow">
  43. <label class="">设置卡密码为:</label>
  44. <input type="password" id="old_pwd" step="1" min="0" placeholder="6位数字密码"
  45. class="save-data mui-input-password padding-r-35">
  46. </div>
  47. <div class="mui-input-row" id="newPwdRow">
  48. <label class="">设置卡的新密码为:</label>
  49. <input type="password" id="new_pwd" step="1" min="0" placeholder="6位数字密码"
  50. class="save-data mui-input-password padding-r-35">
  51. </div>
  52. <div class="mui-input-row">
  53. <label class="">确认密码:</label>
  54. <input type="password" id="new_pwd2" step="1" min="0" placeholder="6位数字密码"
  55. class="save-data mui-input-password padding-r-35">
  56. </div>
  57. <div class="mui-input-row" id="balanceRow" style="display: none">
  58. <label class="">设置卡余额为:</label>
  59. <input type="number" id="balance" max="5000" step="1" min="0"
  60. class="save-data padding-r-35"><span class="font-b-12"
  61. style="position: absolute;right: 15px;top: 12px;">元</span>
  62. </div>
  63. </div>
  64. </div>
  65. <h5 class="padding-10 c-red tipsRow">
  66. </h5>
  67. <div class="subt">
  68. <input class="mui-btn-block" type="submit" value="保存">
  69. </div>
  70. </form>
  71. <script type="text/javascript" src="https://cdn.washpayer.com/components/lib/vue.min.js"></script>
  72. <script src="https://cdn.washpayer.com/components/lib/jquery.min.js"></script>
  73. <script src="https://cdn.washpayer.com/components/lib/mui.min.js"></script>
  74. <script src="/components/custom/js/common.js"></script>
  75. <script src="/app/js/xyf.common.js"></script>
  76. <script src="/app/js/device-param.js"></script>
  77. <script>
  78. let code = getQueryString("code");
  79. // 100269不需要旧密码
  80. if (code == 100269) {
  81. $('#oldPwdRow').remove()
  82. }
  83. initParam({
  84. params: {
  85. cardModeEnable: 'switch',
  86. balance: 'value',
  87. new_pwd: 'value',
  88. old_pwd: 'value',
  89. card_mode: 'radio',
  90. },
  91. getDeviceParamsUrl: '/dealer/getCardMode',
  92. callback: function (payload) {
  93. initCartType(payload.card_mode)
  94. }
  95. })
  96. var nowCardMode = 0
  97. // radio change事件
  98. $('input[type=radio][name=card_mode]').change(function () {
  99. nowCardMode = this.value
  100. initCartType(this.value)
  101. });
  102. function initCartType(value) {
  103. if (value == '0') {
  104. $('.passGroupRow').hide()
  105. $('.tipsRow').text('用户正常使用刷卡扣费充电。');
  106. } else if (value == '1') {
  107. // 发卡模式能改余额
  108. $('.passGroupRow').show()
  109. $('#oldPwdRow').hide()
  110. $('#newPwdRow label').text('设置卡密码为:')
  111. $('#balanceRow').show()
  112. $('.tipsRow').text('如果您想发离线卡给客户,需要在此模式下,将白卡放到刷卡器上,卡会被格式化为离线卡,格式化的时候,会重置卡的密码以及卡的余额。注意,结束后,务必还原到正常刷卡模式,否则用户无法正常刷卡充电。');
  113. } else if (value == '2') {
  114. // 改密码模式不能改余额
  115. $('.passGroupRow').show()
  116. $('#oldPwdRow').show()
  117. $('#oldPwdRow label').text('卡的旧密码为:')
  118. $('#newPwdRow label').text('设置卡的新密码为:')
  119. $('#balanceRow').hide()
  120. $('.tipsRow').text('在此模式下,修改离线卡的密码,离线卡的密码必须和刷卡器的密码一样,离线卡里面的数据才会被识别。注意修改完后,务必切换到正常刷卡模式,否则用户不能正常刷卡充电。');
  121. }
  122. }
  123. function validatePassword() {
  124. if (nowCardMode == 1 || nowCardMode == 2) {
  125. if ($('#new_pwd2').val() != $('#new_pwd').val()) {
  126. mui.alert('两次输入密码不一致,请重新输入');
  127. return false
  128. }
  129. }
  130. }
  131. </script>
  132. </body>
  133. </html>