info.blade.php 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. @extends('admin.layouts')
  2. @section('css')
  3. <link href="/assets/global/vendor/multi-select/multi-select.min.css" type="text/css" rel="stylesheet">
  4. @endsection
  5. @section('content')
  6. <div class="page-content container">
  7. <div class="panel">
  8. <div class="panel-heading">
  9. <h2 class="panel-title">@isset($group)编辑@else添加@endisset用戶分组</h2>
  10. <div class="panel-actions">
  11. <a href="{{route('admin.user.group.index')}}" class="btn btn-danger">返 回</a>
  12. </div>
  13. </div>
  14. @if (Session::has('successMsg'))
  15. <x-alert type="success" :message="Session::get('successMsg')"/>
  16. @endif
  17. @if($errors->any())
  18. <x-alert type="danger" :message="$errors->all()"/>
  19. @endif
  20. <div class="panel-body">
  21. <form action="@isset($group){{route('admin.user.group.update',$group)}}@else{{route('admin.user.group.store')}}@endisset"
  22. method="POST" enctype="multipart/form-data" class="form-horizontal">
  23. @isset($group)@method('PUT')@endisset
  24. @csrf
  25. <div class="form-group row">
  26. <label class="col-md-2 col-sm-3 col-form-label" for="name">分组名称</label>
  27. <div class="col-md-9 col-sm-9">
  28. <input type="text" class="form-control" name="name" id="name"/>
  29. </div>
  30. </div>
  31. <div class="form-group row">
  32. <label class="col-md-2 col-sm-3 col-form-label" for="nodes">选择节点</label>
  33. <div class="col-md-9 col-sm-9">
  34. <div class="btn-group mb-20">
  35. <button type="button" class="btn btn-primary" id="select-all">全 选</button>
  36. <button type="button" class="btn btn-danger" id="deselect-all">清 空</button>
  37. </div>
  38. <select class="form-control" name="nodes[]" id="nodes" data-plugin="multiSelect" multiple>
  39. @foreach($nodes as $id => $name)
  40. <option value="{{$id}}">{{$id . ' - ' . $name}}</option>
  41. @endforeach
  42. </select>
  43. </div>
  44. </div>
  45. <div class="form-actions text-right">
  46. <button type="submit" class="btn btn-success">提 交</button>
  47. </div>
  48. </form>
  49. </div>
  50. </div>
  51. </div>
  52. @endsection
  53. @section('javascript')
  54. <script src="/assets/global/vendor/multi-select/jquery.multi-select.js" type="text/javascript"></script>
  55. <script src="/assets/global/js/Plugin/multi-select.js"></script>
  56. <script src="/assets/global/js/jquery.quicksearch.js" type="text/javascript"></script>
  57. <script type="text/javascript">
  58. @isset($group)
  59. $(document).ready(function() {
  60. $('#name').val('{{$group->name}}');
  61. $('#nodes').multiSelect('select',@json($group->nodes));
  62. });
  63. @endisset
  64. // 权限列表
  65. $('#nodes').multiSelect({
  66. selectableHeader: '<input type=\'text\' class=\'search-input form-control\' autocomplete=\'off\' placeholder=\'待分配规则,此处可搜索\'>',
  67. selectionHeader: '<input type=\'text\' class=\'search-input form-control\' autocomplete=\'off\' placeholder=\'已分配规则,此处可搜索\'>',
  68. afterInit: function() {
  69. const that = this,
  70. $selectableSearch = that.$selectableUl.prev(),
  71. $selectionSearch = that.$selectionUl.prev(),
  72. selectableSearchString = '#' + that.$container.attr('id') + ' .ms-elem-selectable:not(.ms-selected)',
  73. selectionSearchString = '#' + that.$container.attr('id') + ' .ms-elem-selection.ms-selected';
  74. that.qs1 = $selectableSearch.quicksearch(selectableSearchString).on('keydown', function(e) {
  75. if (e.which === 40) {
  76. that.$selectableUl.focus();
  77. return false;
  78. }
  79. });
  80. that.qs2 = $selectionSearch.quicksearch(selectionSearchString).on('keydown', function(e) {
  81. if (e.which === 40) {
  82. that.$selectionUl.focus();
  83. return false;
  84. }
  85. });
  86. },
  87. afterSelect: function() {
  88. this.qs1.cache();
  89. this.qs2.cache();
  90. },
  91. afterDeselect: function() {
  92. this.qs1.cache();
  93. this.qs2.cache();
  94. },
  95. });
  96. // 全选
  97. $('#select-all').click(function() {
  98. $('#nodes').multiSelect('select_all');
  99. return false;
  100. });
  101. // 反选
  102. $('#deselect-all').click(function() {
  103. $('#nodes').multiSelect('deselect_all');
  104. return false;
  105. });
  106. </script>
  107. @endsection