labelstatus.tpl 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
  1. <div class="col-xl-12">
  2. <div class="card-box">
  3. <div class="dropdown pull-right">
  4. <a href="#" class="dropdown-toggle arrow-none card-drop" data-toggle="dropdown" aria-expanded="false">
  5. <i class="mdi mdi-dots-vertical"></i>
  6. </a>
  7. <div class="dropdown-menu dropdown-menu-right">
  8. <!-- item-->
  9. <a href="javascript:void(0);" class="dropdown-item">Refresh Status</a>
  10. <!-- item-->
  11. <a href="javascript:void(0);" class="dropdown-item">Delete All</a>
  12. <!-- item-->
  13. <a href="javascript:void(0);" class="dropdown-item">Blink All</a>
  14. <!-- item-->
  15. <a href="javascript:void(0);" class="dropdown-item">Unbind All</a>
  16. </div>
  17. </div>
  18. <h4 class="header-title mt-0 m-b-30">ESL Status</h4>
  19. <div class="table-responsive-sm">
  20. <table id="datatable" class="table table-sm dt-responsive responsive table-bordered mb-0">
  21. <thead>
  22. <tr>
  23. <th></th>
  24. <th>Label ID</th>
  25. <th>Status</th>
  26. <th>Template</th>
  27. <th>Device Name</th>
  28. <th>DT type</th>
  29. <th>Leds Count</th>
  30. <th>rssi</th>
  31. <th class="text-center">OPS</th>
  32. </tr>
  33. </thead>
  34. <tbody>
  35. <repeat group="{{@ESL_STATUS}}" key="{{@LABEL_ID}}" value="{{@STATUS}}">
  36. <tr>
  37. <td class="text-center"></td>
  38. <td class="text-white font-weight-bold text-center align-middle">{{@LABEL_ID}}</td>
  39. <td><span class="badge badge-{{@STATUS_BADGE_COLOR[@STATUS['data']['esl_state']]}}">{{@STATUS['data']['esl_state']}}</span></td>
  40. <td>[{{@STATUS['data']['template_id']}}] {{@STATUS['data']['template_name']}}</td>
  41. <td>{{@STATUS['data']['devicename']}}</td>
  42. <td>{{@STATUS['data']['devtype_id']}}</td>
  43. <td>{{@STATUS['data']['led']}}</td>
  44. <td><span class="text-danger">{{@STATUS['status']['rssi']}}</span></td>
  45. <td class="text-center">
  46. <button onclick="OpenESLDetails('{{@LABEL_ID}}')" class="btn btn-sm btn-primary">Details</button>
  47. <button onclick="log1()" class="btn btn-sm btn-primary">log1</button>
  48. </td>
  49. </tr>
  50. </repeat>
  51. </tbody>
  52. </table>
  53. </div>
  54. </div>
  55. </div>
  56. <script>
  57. function log1() {
  58. let a = $('#datatable').DataTable().rows({selected: true}).data().toArray();
  59. console.log(a[0][1]);
  60. }
  61. </script>
  62. {* Modal Status *}
  63. <div class="modal fade statusmodal" tabindex="-1" role="dialog" aria-labelledby="statusmodal" aria-hidden="true" style="display: none;">
  64. <div class="modal-dialog modal-dialog-centered">
  65. <div class="modal-content">
  66. <div class="modal-header">
  67. <h4 class="modal-title mt-0" id="statusmodal">Status label <span id="labelID"></span></h4>
  68. <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
  69. </div>
  70. <div class="modal-body">
  71. <div class="row">
  72. <div class="col-6">
  73. <div class="card" id="status_values">
  74. <h5 class="card-header">RSSI <span class="badge badge-warning text-inverse" id="esl_rssi"></span></h5>
  75. <div class="card-body">
  76. <table id="esl_rssi_list" class="table table-borderless table-sm">
  77. </table>
  78. </div>
  79. </div>
  80. </div>
  81. <div class="col-6">
  82. <div class="card">
  83. <h5 class="card-header">Template</h5>
  84. <div class="card-body">
  85. <img class="w-100" id="svgpath" src="">
  86. </div>
  87. </div>
  88. </div>
  89. </div>
  90. <div class="row">
  91. <div class="col-6 mt-2">
  92. <div class="card">
  93. <h5 class="card-header">Label info</h5>
  94. <div class="card-body">
  95. <table class="table table-borderless table-sm" id="cardbox_esl_status">
  96. <tr>
  97. <td>Hello period</td>
  98. <td><span class="badge badge-success" id="hello_period"></span></td>
  99. </tr>
  100. <tr>
  101. <td>Blink count</td>
  102. <td><span class="badge badge-success" id="blink_count"></span></td>
  103. </tr>
  104. <tr>
  105. <td>Hardware Version</td>
  106. <td>
  107. <div class="badge badge-success"><span id="hard_major"></span>.<span id="hard_minor"></span>.<span id="hard_patch"></span></div>
  108. </td>
  109. </tr>
  110. <tr>
  111. <td>Software Version</td>
  112. <td>
  113. <div class="badge badge-success"><span id="soft_major"></span>.<span id="soft_minor"></span>.<span id="soft_patch"></span></div>
  114. </td>
  115. </tr>
  116. </table>
  117. </div>
  118. </div>
  119. </div>
  120. </div>
  121. </div>
  122. </div>
  123. </div>
  124. </div>