nodeList.blade.php 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221
  1. @extends('admin.layouts')
  2. @section('css')
  3. <link href="/assets/global/vendor/bootstrap-table/bootstrap-table.min.css" type="text/css" rel="stylesheet">
  4. <style>
  5. #swal2-content {
  6. display: grid !important;
  7. }
  8. </style>
  9. @endsection
  10. @section('content')
  11. <div class="page-content container-fluid">
  12. <div class="panel">
  13. <div class="panel-heading">
  14. <h3 class="panel-title">节点列表</h3>
  15. <div class="panel-actions btn-group">
  16. <button type="button" onclick="refreshGeo()" class="btn btn-info">
  17. <i class="icon wb-map"></i> 刷新节点地理信息
  18. </button>
  19. <a href="/node/add" class="btn btn-primary"><i class="icon wb-plus"></i> 添加节点</a>
  20. </div>
  21. </div>
  22. <div class="panel-body">
  23. <table class="text-md-center" data-toggle="table" data-mobile-responsive="true">
  24. <thead class="thead-default">
  25. <tr>
  26. <th> ID</th>
  27. <th> 类型</th>
  28. <th> 名称</th>
  29. <th> IP</th>
  30. <th> 域名</th>
  31. <th> 存活</th>
  32. <th> 状态</th>
  33. <th> 在线</th>
  34. <th> 产生流量</th>
  35. <th> 流量比例</th>
  36. <th> 扩展</th>
  37. <th> 操作</th>
  38. </tr>
  39. </thead>
  40. <tbody>
  41. @foreach($nodeList as $node)
  42. <tr class="{{!$node->isOnline && $node->status ? 'table-danger' : ''}}">
  43. <td>
  44. {{$node->id}}
  45. </td>
  46. <td>
  47. @if($node->is_relay)
  48. 中转
  49. @else
  50. {{$node->type_label}}
  51. @endif
  52. </td>
  53. <td> {{$node->name}} </td>
  54. <td> {{$node->is_ddns ? 'DDNS' : $node->ip}} </td>
  55. <td> {{$node->server}} </td>
  56. <td> {{$node->uptime}} </td>
  57. <td> {{$node->status? $node->load : '维护'}} </td>
  58. <td> {{$node->online_users}} </td>
  59. <td> {{$node->transfer}} </td>
  60. <td> {{$node->traffic_rate}} </td>
  61. <td>
  62. @if($node->compatible) <span class="badge badge-lg badge-info">兼</span> @endif
  63. @if($node->single) <span class="badge badge-lg badge-info">单</span> @endif
  64. @if(!$node->is_subscribe)
  65. <span class="badge badge-lg badge-danger"><s>订</s></span> @endif
  66. </td>
  67. <td>
  68. <div class="btn-group">
  69. <button type="button" onclick="refreshGeo('{{$node->id}}')" class="btn btn-primary">
  70. <i id="geo{{$node->id}}" class="icon wb-map"></i>
  71. </button>
  72. <a href="javascript:pingNode('{{$node->id}}')" class="btn btn-primary">
  73. <i id="ping{{$node->id}}" class="icon wb-order"></i>
  74. </a>
  75. <a href="javascript:checkNode('{{$node->id}}')" class="btn btn-primary">
  76. <i id="node{{$node->id}}" class="icon wb-signal"></i>
  77. </a>
  78. <a href="/node/edit?id={{$node->id}}&page={{Request::get('page', 1)}}" class="btn btn-primary">
  79. <i class="icon wb-edit"></i>
  80. </a>
  81. <a href="javascript:delNode('{{$node->id}}','{{$node->name}}')" class="btn btn-danger">
  82. <i class="icon wb-trash"></i>
  83. </a>
  84. <a href="/node/monitor?id={{$node->id}}" class="btn btn-primary">
  85. <i class="icon wb-stats-bars"></i>
  86. </a>
  87. </div>
  88. </td>
  89. </tr>
  90. @endforeach
  91. </tbody>
  92. </table>
  93. </div>
  94. <div class="panel-footer">
  95. <div class="row">
  96. <div class="col-sm-4">
  97. 共 <code>{{$nodeList->total()}}</code> 条线路
  98. </div>
  99. <div class="col-sm-8">
  100. <nav class="Page navigation float-right">
  101. {{$nodeList->links()}}
  102. </nav>
  103. </div>
  104. </div>
  105. </div>
  106. </div>
  107. </div>
  108. @endsection
  109. @section('script')
  110. <script src="/assets/global/vendor/bootstrap-table/bootstrap-table.min.js" type="text/javascript"></script>
  111. <script src="/assets/global/vendor/bootstrap-table/extensions/mobile/bootstrap-table-mobile.min.js" type="text/javascript"></script>
  112. <script type="text/javascript">
  113. // 节点连通性测试
  114. function checkNode(id) {
  115. $.ajax({
  116. type: "POST",
  117. url: '/node/check',
  118. data: {_token: '{{csrf_token()}}', id: id},
  119. beforeSend: function () {
  120. $("#node" + id).removeClass("wb-signal").addClass("wb-loop icon-spin");
  121. },
  122. success: function (ret) {
  123. if (ret.status === 'success') {
  124. swal.fire({
  125. title: ret.title,
  126. type: 'info',
  127. html: '<table class="my-20"><thead class="thead-default"><tr><th> ICMP </th> <th> TCP </th></thead><tbody><tr><td>' + ret.message[0] + '</td><td>' + ret.message[1] + '</td></tr></tbody></table>',
  128. showConfirmButton: false
  129. })
  130. } else {
  131. swal.fire({title: ret.title, text: ret.message, type: "error"})
  132. }
  133. },
  134. complete: function () {
  135. $("#node" + id).removeClass("wb-loop icon-spin").addClass("wb-signal");
  136. }
  137. });
  138. }
  139. // Ping节点获取延迟
  140. function pingNode(id) {
  141. $.ajax({
  142. type: "POST",
  143. url: '/node/ping',
  144. data: {_token: '{{csrf_token()}}', id: id},
  145. beforeSend: function () {
  146. $("#ping" + id).removeClass("wb-order").addClass("wb-loop icon-spin");
  147. },
  148. success: function (ret) {
  149. if (ret.status === 'success') {
  150. swal.fire({
  151. type: 'info',
  152. html: '<table class="my-20"><thead class="thead-default"><tr><th> 电信 </th> <th> 联通 </th> <th> 移动 </th> <th> 香港 </th></thead><tbody><tr><td>' + ret.message[0] + '</td><td>' + ret.message[1] + '</td><td>' + ret.message[2] + '</td><td>' + ret.message[3] + '</td></tr></tbody></table>',
  153. showConfirmButton: false
  154. })
  155. } else {
  156. swal.fire({title: ret.message, type: "error"})
  157. }
  158. },
  159. complete: function () {
  160. $("#ping" + id).removeClass("wb-loop icon-spin").addClass("wb-order");
  161. }
  162. });
  163. }
  164. // 刷新节点地理信息
  165. function refreshGeo(id) {
  166. $.ajax({
  167. type: "GET",
  168. url: '/node/refreshGeo',
  169. data: {_token: '{{csrf_token()}}', id: id},
  170. beforeSend: function () {
  171. $("#geo" + id).removeClass("wb-map").addClass("wb-loop icon-spin");
  172. },
  173. success: function (ret) {
  174. if (ret.status === 'success') {
  175. swal.fire({type: 'info', title: ret.message, showConfirmButton: false})
  176. } else {
  177. swal.fire({title: ret.message, type: "error"})
  178. }
  179. },
  180. complete: function () {
  181. $("#geo" + id).removeClass("wb-loop icon-spin").addClass("wb-map");
  182. }
  183. });
  184. }
  185. // 删除节点
  186. function delNode(id, name) {
  187. swal.fire({
  188. title: '警告',
  189. text: '确定删除节点 【' + name + '】 ?',
  190. type: 'warning',
  191. showCancelButton: true,
  192. cancelButtonText: '{{trans('home.ticket_close')}}',
  193. confirmButtonText: '{{trans('home.ticket_confirm')}}',
  194. }).then((result) => {
  195. if (result.value) {
  196. $.post("/node/delete", {id: id, _token: '{{csrf_token()}}'}, function (ret) {
  197. if (ret.status === 'success') {
  198. swal.fire({title: ret.message, type: 'success', timer: 1000, showConfirmButton: false})
  199. .then(() => window.location.reload())
  200. } else {
  201. swal.fire({title: ret.message, type: "error"}).then(() => window.location.reload())
  202. }
  203. });
  204. }
  205. });
  206. }
  207. // 显示提示
  208. function showIdTips() {
  209. swal.fire({
  210. title: '复制成功',
  211. type: 'success',
  212. timer: 1300,
  213. showConfirmButton: false,
  214. });
  215. }
  216. </script>
  217. @endsection