SettingManagement.blade.php 6.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. @extends('admin.master')
  2. @section('content')
  3. <div class="row">
  4. <div class="col-lg-12">
  5. <div class="contentpanel">
  6. <form id="listForm" method="post">
  7. <!-- 功能按鈕(新增/批量處理等等) -->
  8. <div class="row" style="margin-bottom: 5px;">
  9. <div class="col-lg-12">
  10. <ol class="headermenu">
  11. <li>
  12. <button class="btn btn-darkblue btn-xs" id="btnNew"><strong>新增</strong></button>
  13. </li>
  14. </ol>
  15. </div>
  16. </div>
  17. <!-- 搜尋段 -->
  18. <div class="panel panel-default">
  19. <div class="panel-heading" data-toggle="collapse" data-target="#search_content">
  20. <h3 class="panel-title">參數維護</h3>
  21. </div>
  22. <div id="search_content" class="collapse in">
  23. <div class="panel-body">
  24. <!-- 建立時間範圍 from -->
  25. <div class="form-group col-xs-12 col-sm-6 col-lg-6">
  26. <label for="cDateStart">建立時間範圍(起)</label>
  27. <input type="text" class="form-control input-sm" id="cDateStart"
  28. maxlength="10">
  29. </div>
  30. <!-- 建立時間範圍 to -->
  31. <div class="form-group col-xs-12 col-sm-6 col-lg-6">
  32. <label for="cDateFinal">建立時間範圍(迄)</label>
  33. <input type="text" class="form-control input-sm" id="cDateFinal"
  34. maxlength="10">
  35. </div>
  36. <!-- 用途 -->
  37. <div class="form-group col-xs-12 col-sm-6 col-lg-6">
  38. <label for="name">用途</label>
  39. <input type="text" class="form-control input-sm" id="name" maxlength="32">
  40. </div>
  41. <!-- 有效否 -->
  42. <div class="form-group col-xs-12 col-sm-6 col-lg-6">
  43. <label for="active">有效否</label>
  44. <select class="form-control input-sm" id="active">
  45. <option value="">全部</option>
  46. @foreach($active as $k => $data)
  47. <option value="{{ $k }}">{{ $data }}</option>
  48. @endforeach
  49. </select>
  50. </div>
  51. <!-- Search -->
  52. <div class="form-group col-xs-12 col-sm-12 col-lg-12">
  53. <a class="btn btn-success btn-xs" onclick="javascript: custom_search();">
  54. <div class="glyphicon glyphicon-search"></div>
  55. </a>
  56. </div>
  57. </div>
  58. </div>
  59. </div>
  60. <hr class="search-hr"/>
  61. <!-- 列表段 -->
  62. <div class="row">
  63. <div class="col-lg-12">
  64. <table id="GridView1" class="table table-striped table-bordered" cellspacing="0">
  65. <thead>
  66. <tr>
  67. <th>ID</th>
  68. <th>用途</th>
  69. <th>變數名稱</th>
  70. <th>變數內容</th>
  71. <th>有效否</th>
  72. <th>建立時間</th>
  73. <th>修改時間</th>
  74. <th>修改人</th>
  75. </tr>
  76. </thead>
  77. </table>
  78. </div>
  79. </div>
  80. </form>
  81. <!-- row -->
  82. </div>
  83. </div>
  84. </div>
  85. @endsection
  86. @section('extjs')
  87. <script>
  88. $(document).ready(function () {
  89. var table = $('#GridView1').dataTable({
  90. "scrollX": true,
  91. "processing": true,
  92. "serverSide": true,
  93. "ajax": "settingManagement/grid",
  94. "paging": true,
  95. "ordering": true,
  96. "info": true,
  97. "order": [[1, "desc"]],
  98. "stateSave": true,
  99. "pagingType": "full",
  100. "bFilter": true,
  101. "aoColumnDefs": [{
  102. 'bSortable': false,
  103. 'aTargets': [] //不想參加排序的欄位,可指定多個,逗號分隔
  104. }]
  105. });
  106. // 從網址參觸發搜尋
  107. custom_search();
  108. $('#GridView1_filter').hide();
  109. });
  110. //客製化搜尋欄位
  111. function custom_search() {
  112. $('#GridView1').DataTable()
  113. .column(1).search($('#name').val())
  114. .column(2).search($('#cDateStart').val() + "\n" + $('#cDateFinal').val())
  115. .column(3).search($('#active').val())
  116. ;
  117. $('#GridView1').dataTable().fnDraw(true);
  118. }
  119. // 新增
  120. $("#btnNew").click(function () {
  121. location.href = 'settingManagement/create';
  122. return false;
  123. });
  124. //日期選擇器
  125. $('#cDateStart').datepicker({
  126. dateFormat: 'yy-mm-dd'
  127. });
  128. $('#cDateFinal').datepicker({
  129. dateFormat: 'yy-mm-dd'
  130. });
  131. </script>
  132. @endsection