deliveries.php 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227
  1. <?php
  2. $i=null;
  3. function decimalAndNumberFormat1($number){
  4. $i = number_format(round($number,0));
  5. return $i;
  6. }
  7. function decimalAndNumberFormat2($number){
  8. $i = number_format(round($number,1),1);
  9. return $i;
  10. }
  11. function decimalAndNumberFormat3($number){
  12. $i = number_format(round($number,3));
  13. return $i;
  14. }
  15. ?>
  16. <!DOCTYPE html>
  17. <html>
  18. <head>
  19. <meta charset="utf-8">
  20. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  21. <title>Forward Station Server</title>
  22. <!-- Tell the browser to be responsive to screen width -->
  23. <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  24. <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
  25. <link href="https://cdn.datatables.net/r/bs-3.3.5/jq-2.1.4,dt-1.10.8/datatables.min.css" rel="stylesheet"/>
  26. <script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
  27. <script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap.min.js" charset="utf-8"></script>
  28. <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
  29. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
  30. <!-- Bootstrap 3.3.7 -->
  31. <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
  32. <!-- Font Awesome -->
  33. <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
  34. <!-- Ionicons -->
  35. <link rel="stylesheet" href="bower_components/Ionicons/css/ionicons.min.css">
  36. <!-- Theme style -->
  37. <link rel="stylesheet" href="dist/css/AdminLTE.min.css">
  38. <link rel="stylesheet" href="dist/css/style.css">
  39. <!-- <link rel="stylesheet" href="dist/css/skins/_all-skins.min.css"> -->
  40. <!-- Morris chart -->
  41. <link rel="stylesheet" href="bower_components/morris.js/morris.css">
  42. <!-- jvectormap -->
  43. <link rel="stylesheet" href="bower_components/jvectormap/jquery-jvectormap.css">
  44. <!-- Date Picker -->
  45. <link rel="stylesheet" href="bower_components/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css">
  46. <!-- Daterange picker -->
  47. <link rel="stylesheet" href="bower_components/bootstrap-daterangepicker/daterangepicker.css">
  48. <!-- bootstrap wysihtml5 - text editor -->
  49. <link rel="stylesheet" href="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">
  50. <!-- Google Font -->
  51. <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">
  52. <link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
  53. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css">
  54. </head>
  55. <body class="hold-transition skin-blue sidebar-mini">
  56. <div class="wrapper">
  57. <?php include("main_header.php");?>
  58. <!-- Content Wrapper. Contains page content -->
  59. <div class="content-wrapper"><br>
  60. <?php include "api/v1/Deliveries/selectDeliveryVw.php" ?>
  61. <table id="example" class="table display table-striped table-bordered table-hover table-sm" cellspacing="0" width="100%">
  62. <thead>
  63. <tr>
  64. <th></th>
  65. <th>Action</th>
  66. <th>Message</th>
  67. <th>id</th>
  68. <th>Tank</th>
  69. <th>Status</th>
  70. <th>Start</th>
  71. <th>End</th>
  72. </tr>
  73. </thead>
  74. <tfoot>
  75. <tr>
  76. <th></th>
  77. <th>Action</th>
  78. <th>Message</th>
  79. <th>id</th>
  80. <th>Tank</th>
  81. <th>Status</th>
  82. </tr>
  83. </tfoot>
  84. </table>
  85. <script type="text/javascript">
  86. /* Formatting function for row details - modify as you need */
  87. function format ( d ) {
  88. // `d` is the original data object for the row
  89. return '<table id="example" class="table table-bordered table-sm" cellspacing="0" width="100%" style="background-color:#3F51B5;color:white;">'+
  90. '<tr>'+
  91. '<th>Product:</th>'+
  92. '<td>'+d.Product+'</td>'+
  93. '</tr>'+
  94. '<tr>'+
  95. '<th>Supplier Id:</th>'+
  96. '<td>'+d.SupplierId+'</td>'+
  97. '</tr>'+
  98. '<tr>'+
  99. '<th>Supplier Name:</th>'+
  100. '<td>'+d.SupplierName+'</td>'+
  101. '</tr>'+
  102. '<tr>'+
  103. '<th>Delivery Car Number:</th>'+
  104. '<td>'+d.DeliveryCarNumber+'</td>'+
  105. '</tr>'+
  106. '<tr>'+
  107. '<th>OrderPrice:</th>'+
  108. '<td>'+d.OrderPrice+'</td>'+
  109. '</tr>'+
  110. '<tr>'+
  111. '<th>OrderVolume:</th>'+
  112. '<td>'+d.OrderVolume+'</td>'+
  113. '</tr>'+
  114. '<tr>'+
  115. '<th>DeliverVolume:</th>'+
  116. '<td>'+d.DeliverVolume+'</td>'+
  117. '</tr>'+
  118. '<tr>'+
  119. '<th>FuelPoints:</th>'+
  120. '<td>'+d.FuelPoints+'</td>'+
  121. '</tr>'+
  122. '<tr>'+
  123. '<th>TankGroup:</th>'+
  124. '<td>'+d.TankGroup+'</td>'+
  125. '</tr>'+'<hr>'+
  126. '<tr>'+
  127. '<th>Tank id</th>'+
  128. '<th>Start Volume</th>'+
  129. '<th>End Volume</th>'+
  130. '<th>Input Volume</th>'+
  131. '</tr>'+
  132. '<tr>'+
  133. '<th>Fp id</th>'+
  134. '<th>Start Volume</th>'+
  135. '<th>End Volume</th>'+
  136. '<th>Output Volume</th>'+
  137. '</tr>'+
  138. '</table>';
  139. }
  140. $(document).ready(function() {
  141. var table = $('#example').DataTable( {
  142. "ajax": "api/v1/Deliveries/deliveryDetails.txt",
  143. "columns": [
  144. {
  145. "className": 'details-control',
  146. "orderable": false,
  147. "data": null,
  148. "defaultContent": ''
  149. },
  150. { "data": "Action" },
  151. { "data": "Message" },
  152. { "data": "Id" },
  153. { "data": "Tank" },
  154. { "data": "Status" },
  155. { "data": "Start" },
  156. { "data": "End" },
  157. ],
  158. "order": [[1, 'asc']]
  159. } );
  160. // Add event listener for opening and closing details
  161. $('#example tbody').on('click', 'td.details-control', function () {
  162. var tr = $(this).closest('tr');
  163. var row = table.row( tr );
  164. if ( row.child.isShown() ) {
  165. // This row is already open - close it
  166. row.child.hide();
  167. tr.removeClass('shown');
  168. }
  169. else {
  170. // Open this row
  171. row.child( format(row.data()) ).show();
  172. tr.addClass('shown');
  173. }
  174. } );
  175. } );
  176. </script>
  177. </div>
  178. <!-- /.content-wrapper -->
  179. </div>
  180. <!-- ./wrapper -->
  181. <!-- jQuery 3 -->
  182. <script src="bower_components/jquery/dist/jquery.min.js"></script>
  183. <script>
  184. $.widget.bridge('uibutton', $.ui.button);
  185. </script>
  186. <!-- Bootstrap 3.3.7 -->
  187. <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
  188. <!-- Morris.js charts -->
  189. <script src="bower_components/raphael/raphael.min.js"></script>
  190. <script src="bower_components/morris.js/morris.min.js"></script>
  191. <script src="bower_components/moment/min/moment.min.js"></script>
  192. <script src="bower_components/bootstrap-daterangepicker/daterangepicker.js"></script>
  193. <!-- datepicker -->
  194. <script src="bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
  195. <!-- Bootstrap WYSIHTML5 -->
  196. <script src="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
  197. <!-- Slimscroll -->
  198. <!-- FastClick -->
  199. <script src="bower_components/fastclick/lib/fastclick.js"></script>
  200. <!-- AdminLTE App -->
  201. <script src="dist/js/adminlte.min.js"></script>
  202. <!-- AdminLTE dashboard demo (This is only for demo purposes) -->
  203. <script src="dist/js/pages/dashboard.js"></script>
  204. <!-- AdminLTE for demo purposes -->
  205. <script src="dist/js/demo.js"></script>
  206. </body>
  207. </html>
  208. <!-- -->