labelstatus.tpl 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144
  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:ESLMultiOperations('resetfailcounter');" class="dropdown-item">Reset Fail Counter</a>
  10. <!-- item-->
  11. <a href="javascript:ESLMultiOperations('blinklabels')" class="dropdown-item">Blink</a>
  12. <!-- item-->
  13. <a href="javascript:ESLMultiOperations('unbind');" class="dropdown-item">Unbind</a>
  14. <!-- item-->
  15. <a href="javascript:TemplateSelector(false);" class="dropdown-item">Change Template</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 table-striped">
  21. <thead>
  22. <tr>
  23. <th></th>
  24. <th>Label ID</th>
  25. <th>Bat Level</th>
  26. <th>Status</th>
  27. <th>Template</th>
  28. <th>Device Name</th>
  29. <th>DT type</th>
  30. <th>Display Resolution</th>
  31. <th>Leds Count</th>
  32. <th>rssi</th>
  33. <th class="text-center">OPS</th>
  34. </tr>
  35. </thead>
  36. <tbody>
  37. <repeat group="{{@ESL_STATUS}}" key="{{@LABEL_ID}}" value="{{@STATUS}}">
  38. <tr>
  39. <td class="text-center"></td>
  40. <td class="text-white font-weight-bold">{{@LABEL_ID}}</td>
  41. <td class="text-center"><i class="text-warning fa fa-battery-{{@BATLEV_ICONS[@STATUS['status']['bat_level']]}}"></i></td>
  42. <td class="text-center"><span class="badge badge-{{@STATUS_BADGE_COLOR[@STATUS['data']['esl_state']]??'primary'}}">{{@STATUS['data']['esl_state']}}</span></td>
  43. <td>[{{@STATUS['data']['template_id']}}] {{@STATUS['data']['template_name']}}</td>
  44. <td>{{@STATUS['data']['devicename']}}</td>
  45. <td>{{@STATUS['data']['devtype_id']}}</td>
  46. <td>{{@STATUS['data']['resolution']}}</td>
  47. <td>{{@STATUS['data']['led']}}</td>
  48. <td><span class="text-danger">{{@STATUS['status']['rssi']}}</span></td>
  49. <td class="text-center">
  50. <button onclick="OpenESLDetails('{{@LABEL_ID}}')" class="btn btn-sm btn-primary">Details</button>
  51. </td>
  52. </tr>
  53. </repeat>
  54. </tbody>
  55. </table>
  56. </div>
  57. </div>
  58. </div>
  59. {* Modal Status *}
  60. <div class="modal fade statusmodal" tabindex="-1" role="dialog" aria-labelledby="statusmodal" aria-hidden="true" style="display: none;">
  61. <div class="modal-dialog modal-dialog-centered">
  62. <div class="modal-content">
  63. <div class="modal-header">
  64. <h4 class="modal-title mt-0" id="statusmodal">Status label <span id="labelID"></span></h4>
  65. <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
  66. </div>
  67. <div class="modal-body">
  68. <div class="row">
  69. <div class="col-6">
  70. <div class="card" id="status_values">
  71. <h5 class="card-header">RSSI <span class="badge badge-warning text-inverse" id="esl_rssi"></span></h5>
  72. <div class="card-body">
  73. <table id="esl_rssi_list" class="table table-borderless table-sm">
  74. </table>
  75. </div>
  76. </div>
  77. </div>
  78. <div class="col-6">
  79. <div class="card">
  80. <h5 class="card-header">Template</h5>
  81. <div id="svgtpl" class="card-body"></div>
  82. </div>
  83. </div>
  84. </div>
  85. <div class="row">
  86. <div class="col-6 mt-2">
  87. <div class="card">
  88. <h5 class="card-header">Label info</h5>
  89. <div class="card-body">
  90. <table class="table table-borderless table-sm table" id="cardbox_esl_status">
  91. <tr>
  92. <td>Hello period</td>
  93. <td><span class="badge badge-success" id="hello_period"></span></td>
  94. </tr>
  95. <tr>
  96. <td>Blink count</td>
  97. <td><span class="badge badge-success" id="blink_count"></span></td>
  98. </tr>
  99. <tr>
  100. <td>Hardware Version</td>
  101. <td>
  102. <div class="badge badge-success"><span id="hard_major"></span>.<span id="hard_minor"></span>.<span id="hard_patch"></span></div>
  103. </td>
  104. </tr>
  105. <tr>
  106. <td>Software Version</td>
  107. <td>
  108. <div class="badge badge-success"><span id="soft_major"></span>.<span id="soft_minor"></span>.<span id="soft_patch"></span></div>
  109. </td>
  110. </tr>
  111. </table>
  112. </div>
  113. </div>
  114. </div>
  115. </div>
  116. </div>
  117. </div>
  118. </div>
  119. </div>
  120. {* Modal Template Selector*}
  121. <div class="modal fade templateselector" tabindex="-1" role="dialog" aria-labelledby="templateselector" aria-hidden="true" style="display: none;">
  122. <div class="modal-dialog modal-full modal-dialog-centered">
  123. <div class="modal-content">
  124. <div class="modal-header">
  125. <h4 class="modal-title mt-0" id="templateselector">Template Selector</h4>
  126. <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
  127. </div>
  128. <div class="modal-body"></div>
  129. </div>
  130. </div>
  131. </div>