API tools faq
paste
Guest User

Kasir_view.php

a guest
Mar 27th, 2020
537
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
PHP 21.24 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4. <head>
  5.  
  6.   <meta charset="utf-8">
  7.   <meta http-equiv="X-UA-Compatible" content="IE=edge">
  8.   <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  9.   <meta name="description" content="">
  10.   <meta name="author" content="">
  11.   <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
  12.   <link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
  13.   <link href="<?= base_url() ?>assets/css/sb-admin-2.css" rel="stylesheet">
  14.   <link href="<?= base_url() ?>assets/DataTables-1.10.18/css/dataTables.bootstrap4.min.css" rel="stylesheet">
  15.  
  16.   <link href="<?= base_url() ?>assets/jquery-ui-1.12.1.custom/jquery-ui.min.css" rel="stylesheet">
  17.   <link href="<?= base_url() ?>assets/css/style.css" rel="stylesheet">
  18.   <link href="<?= base_url() ?>assets/images/Logo.png" rel="icon">
  19.   <title>Toko MI</title>
  20.   <style>
  21.       @media print{
  22.           #wrapper {
  23.               display:none;
  24.               }
  25.          
  26.           .modal-footer, .modal-header {
  27.               display:none;
  28.               }
  29.  
  30.           title{
  31.             display: none;
  32.           }
  33.           }
  34.   </style>
  35. </head>
  36.  
  37. <body id="page-top">
  38.  
  39.   <!-- Page Wrapper -->
  40.   <div id="wrapper">
  41.  
  42.     <!-- Sidebar -->
  43.     <ul class="navbar-nav bg-gradient-primary sidebar sidebar-dark accordion" id="accordionSidebar">
  44.  
  45.       <!-- Sidebar - Brand -->
  46.       <a class="sidebar-brand d-flex align-items-center justify-content-center" href="<?= site_url() ?>">
  47.         <div class="sidebar-brand-icon rotate-n-15">
  48.         <i class="fas fa-cash-register"></i>
  49.         </div>
  50.         <div class="sidebar-brand-text mx-3">
  51.           <?php if($this->session->userdata('level')==1)
  52.           {
  53.             echo 'admin';
  54.           }else{
  55.             echo 'kasir';
  56.           }
  57.           ?>
  58.         </div>
  59.       </a>
  60.       <!-- Divider -->
  61.       <hr class="sidebar-divider my-0">
  62.  
  63.       <!-- Nav Item - Dashboard -->
  64.       <li class="nav-item active">
  65.         <a class="nav-link" href="<?= site_url() ?>">
  66.           <i class="fas fa-fw fa-cash-register"></i>
  67.           <span>Kasir</span></a>
  68.       </li>
  69.       <!-- Divider -->
  70.       <hr class="sidebar-divider">
  71.  
  72.       <!-- Nav Item - Tables pembelian -->
  73.       <li class="nav-item">
  74.         <a class="nav-link" href="<?= site_url() ?>option/data_barang">
  75.           <i class="fas fa-fw fa-cubes"></i>
  76.           <span>Data Barang</span></a>
  77.       </li>
  78.       <!-- Divider -->
  79.       <hr class="sidebar-divider">
  80.  
  81.       <!-- Nav Item - Tables -->
  82.       <li class="nav-item">
  83.         <a class="nav-link" href="<?= site_url() ?>option/data_penjualan">
  84.         <i class="far fa-handshake"></i>
  85.           <span>Riwayat Penjualan</span></a>
  86.       </li>
  87.       <!-- Divider -->
  88.       <hr class="sidebar-divider">
  89.  
  90.       <!-- Nav Item - Pages Collapse Menu -->
  91.       <li class="nav-item">
  92.         <a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="true" aria-controls="collapseTwo">
  93.         <i class="fas fa-money-bill-wave"></i>
  94.           <span>Keuntungan</span>
  95.         </a>
  96.         <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionSidebar">
  97.           <div class="bg-white py-2 collapse-inner rounded">
  98.             <a class="collapse-item" href="<?= site_url() ?>option/laba_tabel"><i class="fas fa-table"></i> Tabel</a>
  99.             <a class="collapse-item" href="<?= site_url() ?>option/laba_diagram"><i class="far fa-chart-bar"></i> Diagram</a>
  100.         </div>
  101.       </li>
  102.       <!-- Divider -->
  103.       <hr class="sidebar-divider">
  104.  
  105.       <?php if($this->session->userdata('level')==1){ ?>
  106.  
  107.       <!-- Nav Item - Dashboard -->
  108.       <li class="nav-item">
  109.         <a class="nav-link" href="<?= site_url() ?>option/data_user">
  110.         <i class="far fa-user"></i>
  111.           <span>Data User</span></a>
  112.       </li>
  113.       <!-- Divider -->
  114.       <hr class="sidebar-divider">
  115.  
  116.       <!-- Nav Item - Dashboard -->
  117.       <li class="nav-item">
  118.         <a class="nav-link" href="<?= site_url() ?>option/data_toko">
  119.         <i class="fas fa-store"></i>
  120.           <span>Toko</span></a>
  121.       </li>
  122.       <!-- Divider -->
  123.       <hr class="sidebar-divider">
  124.  
  125.       <?php
  126.       }
  127.       ?>
  128.  
  129.  
  130.       <!-- Sidebar Toggler (Sidebar) -->
  131.       <div class="text-center d-none d-md-inline">
  132.         <button class="rounded-circle border-0" id="sidebarToggle"></button>
  133.       </div>
  134.  
  135.     </ul>
  136.     <!-- End of Sidebar -->
  137.  
  138.     <!-- Content Wrapper -->
  139.     <div id="content-wrapper" class="d-flex flex-column">
  140.  
  141.       <!-- Main Content -->
  142.       <div id="content">
  143.  
  144.         <!-- Topbar -->
  145.         <nav class="navbar navbar-expand navbar-light bg-white topbar mb-4 static-top shadow">
  146.  
  147.           <!-- Sidebar Toggle (Topbar) -->
  148.           <button id="sidebarToggleTop" class="btn btn-link d-md-none rounded-circle mr-3">
  149.             <i class="fa fa-bars"></i>
  150.           </button>
  151.  
  152.           <div class="h3 ml-auto">Kasir</div>
  153.  
  154.          
  155.           <!-- Topbar Navbar -->
  156.           <ul class="navbar-nav ml-auto">
  157.  
  158.             <div class="topbar-divider d-none d-sm-block"></div>
  159.  
  160.             <!-- Nav Item - User Information -->
  161.             <li class="nav-item dropdown no-arrow">
  162.               <a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
  163.                 <span class="mr-2 d-none d-lg-inline text-gray-600 small"><?= $this->session->userdata('username') ?></span>
  164.                 <img class="img-profile rounded-circle" src="<?= site_url() ?>assets/images/profil.png">
  165.               </a>
  166.               <!-- Dropdown - User Information -->
  167.               <div class="dropdown-menu dropdown-menu-right shadow animated--grow-in" aria-labelledby="userDropdown">
  168.                 <a class="dropdown-item" href="<?= base_url() ?>option/akun">
  169.                   <i class="fas fa-user fa-sm fa-fw mr-2 text-gray-400"></i>
  170.                   Profile
  171.                 </a>
  172.                 <div class="dropdown-divider"></div>
  173.                 <a class="dropdown-item" href="<?= base_url() ?>option/logout">
  174.                   <i class="fas fa-power-off fa-sm fa-fw mr-2 text-gray-400"></i>
  175.                   Logout
  176.                 </a>
  177.               </div>
  178.             </li>
  179.  
  180.           </ul>
  181.  
  182.         </nav>
  183.         <!-- End of Topbar -->
  184.  
  185.         <!-- Begin Page Content -->
  186.         <div class="container-fluid">
  187.          
  188.             <div class="col-sm-12">
  189.                 <div class="row">
  190.                     <div class="col-sm-12 col-md-6 ">
  191.  
  192.                         <form class="form-horizontal" id="form_transaksi" role="form">
  193.  
  194.                             <div class="form-group row">
  195.                               <label class="col-md-3 col-form-label">ID/Nama</label>
  196.                                 <div class="col-md-9">
  197.                                   <input class="form-control reset" id="pencarian"  name="id" type="text" placeholder="id / nama" >
  198.                                 </div>
  199.                             </div>
  200.                            
  201.                             <div class="form-group row">
  202.                               <label class="col-md-3 col-form-label">Nama</label>
  203.                                 <div class="col-md-9">
  204.                                   <input class="form-control reset" type="text" id="nama_barang" name="nama" readonly="" placeholder="nama" >
  205.                                 </div>
  206.                             </div>
  207.                            
  208.                             <div class="form-group row">
  209.                               <label class="col-md-3 col-form-label">Harga</label>
  210.                                 <div class="col-md-9">
  211.                                   <input class="form-control reset" type="text" name="harga" id="harga"  readonly="" placeholder="0"value="">
  212.                                 </div>
  213.                             </div>
  214.                            
  215.                               <input type="hidden" class="reset" id="jenis_promo" name="jenis_promo">
  216.                               <input type="hidden" class="reset" id="potongan" name="potongan">
  217.                               <input type="hidden" class="reset" id="harga_potongan" name="harga_potongan">
  218.                                
  219.                             <div class="form-group row">
  220.                               <label class="col-md-3 col-form-label">Jumlah</label>
  221.                                 <div class="col-md-9">
  222.                                   <input class="form-control reset" type="number" readonly="readonly" onkeyup="subTotal(this.value)" id="qty" min="0" name="qty" placeholder="jumlah">
  223.                                 </div>
  224.                             </div>
  225.                            
  226.                             <div class="form-group row">
  227.                               <label class="col-md-3 col-form-label">Sub total</label>
  228.                                 <div class="col-md-9">
  229.                                   <input class="form-control reset" type="text" name="sub_total" id="sub_total"  readonly="" placeholder="0" value="">
  230.                                 </div>
  231.                             </div>
  232.                         </form>
  233.  
  234.                         <button type="button" class="btn btn-md btn-primary" id="tambah" disabled="disabled" onclick="addbarang()"><i class="fa fa-shopping-cart"></i> input</button>
  235.                     </div>
  236.  
  237.                     <div class="col-sm-12 col-md-6 ">
  238.  
  239.                         <div class="form-group row">
  240.                           <label class="col-md-3 col-form-label">Total</label>
  241.                             <div class="col-md-9">
  242.                               <input class="form-control form-control-lg res" type="text" readonly="" name="total" id="total" value="<?= number_format(
  243.                                   $this->cart->total(), 0 , '' , '.' ); ?>" >
  244.                             </div>
  245.                         </div>
  246.                        
  247.                         <div class="form-group row">
  248.                           <label class="col-md-3 col-form-label">Bayar</label>
  249.                             <div class="col-md-9">
  250.                               <input class="form-control form-control-lg res" type="number" id="bayar" name="bayar" onkeyup="showKembali(this.value)"  placeholder="0">
  251.                             </div>
  252.                         </div>
  253.                        
  254.                         <div class="form-group row">
  255.                           <label class="col-md-3 col-form-label">Kembali</label>
  256.                             <div class="col-md-9">
  257.                               <input class="form-control form-control-lg res" type="text" id="kembali" readonly="" name="kembali"  >
  258.                             </div>
  259.                         </div>
  260.                        
  261.                     </div>
  262.                 </div>
  263.             </div>
  264.            
  265.               <table id="tabelBarang" class="table table-striped table-bordered nowrap" style="width:100%">
  266.                 <thead>
  267.                   <tr>
  268.                     <th>No</th>
  269.                     <th>Nama</th>
  270.                     <th>Jenis</th>
  271.                     <th>Potongan</th>
  272.                     <th>Harga Potong</th>
  273.                     <th>Harga</th>
  274.                     <th>Jumlah</th>
  275.                     <th>Sub total</th>
  276.                     <th>Opsi</th>
  277.                   </tr>
  278.                 </thead>
  279.                 <tbody>
  280.                 </tbody>
  281.               </table>
  282.                   <button type="button" class="btn btn-md btn-primary" id="selesai" disabled="disabled" >selesai </button>
  283.         </div>
  284.         <!-- /.container-fluid -->
  285.  
  286.       </div>
  287.       <!-- End of Main Content -->
  288.  
  289.       <!-- Footer -->
  290.       <footer class="sticky-footer bg-white">
  291.         <div class="container my-auto">
  292.         </div>
  293.       </footer>
  294.       <!-- End of Footer -->
  295.  
  296.     </div>
  297.     <!-- End of Content Wrapper -->
  298.  
  299.   </div>
  300.   <!-- End of Page Wrapper -->
  301.  
  302.   <!-- Scroll to Top Button-->
  303.   <a class="scroll-to-top rounded" href="#page-top">
  304.     <i class="fas fa-angle-up"></i>
  305.   </a>
  306.  
  307.   <script src="<?= base_url() ?>assets/jquery/jquery-3.2.1.min.js"></script>
  308.   <script src="<?= base_url() ?>assets/bootstrap-4.1.3/js/bootstrap.min.js"></script>
  309.   <script src="<?= base_url() ?>assets/js/sb-admin-2.js"></script>
  310.   <script src="<?= base_url() ?>assets/DataTables-1.10.18/js/jquery.dataTables.min.js"></script>
  311.   <script src="<?php echo base_url() ?>assets/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
  312.   <script src="<?php echo base_url() ?>assets/jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>
  313.   <script>
  314.       var table;
  315.       $(document).ready(function(){
  316.           table = $('#tabelBarang').DataTable({
  317.               paging: false,
  318.               "info": false,
  319.               "searching": false,
  320.               "ajax": {
  321.                   "url": "<?php echo base_url() ?>option/list_transaksi",
  322.                   "type": "POST"
  323.                   },
  324.               "columnDefs": [
  325.               {
  326.                   "targets": [ 2,3,4,5,6,7,8 ],
  327.                   "orderable": false,
  328.               },
  329.               ],
  330.               });
  331.            
  332.            $('#pencarian').focus();
  333.        });
  334.        
  335.        function reload_table(){
  336.            table.ajax.reload(null,false);
  337.        }
  338.        
  339.       function subTotal(qty){
  340.           var harga = $('#harga').val().replace(".", "").replace(".", "");
  341.           var promo = $('#jenis_promo').val();
  342.           var potongan = $('#potongan').val();
  343.           var hrg_potong = $('#harga_potongan').val();
  344.           if(promo == 'minimal'){
  345.               var induk = Math.floor(qty / potongan);
  346.               var sisa = qty% potongan;
  347.               var sub = (induk*hrg_potong)+(harga*sisa);
  348.               $('#sub_total').val(convertToRupiah(sub));
  349.               $('#tambah').removeAttr("disabled");
  350.           }else{
  351.               var diskon = harga - (harga*potongan/100);
  352.               $('#sub_total').val(convertToRupiah(diskon*qty));
  353.               $('#tambah').removeAttr("disabled");
  354.           }
  355.          
  356.       }
  357.      
  358.       function addbarang(){
  359.           var id = $('#id').val();
  360.           var qty = $('#qty').val();
  361.           $.ajax({
  362.               url : "<?php echo base_url() ?>option/add_keranjang",
  363.               type: "POST",
  364.               data: $('#form_transaksi').serialize(),
  365.               dataType: "JSON",
  366.               success: function(data){
  367.                   reload_table();
  368.                   $('#tambah').attr("disabled","disabled");
  369.                   $('#qty').attr("readonly","readonly");
  370.                   $('#bayar').focus();
  371.               },
  372.               error: function (jqXHR, textStatus, errorThrown){
  373.                   alert('Error adding data');
  374.               }
  375.           });
  376.           showTotal();
  377.           showKembali($('#bayar').val());
  378.           $('.reset').val('');
  379.       }
  380.      
  381.       document.onkeydown = function(e){
  382.         var q = $('#qty').val();
  383.         var byr = $('#bayar').val();
  384.         if(q !==''){
  385.           switch(e.keyCode){
  386.           case 13:
  387.           addbarang();
  388.           break;
  389.         }
  390.         }
  391.  
  392.         if(byr !==''){
  393.           switch(e.keyCode){
  394.           case 13:
  395.           selesai();
  396.           break;
  397.         }
  398.         }
  399.       // 113 f2
  400.       // 37 kiri 38 atas 39 kanan 40 bawah
  401.       switch(e.keyCode){
  402.         case 113:
  403.         $('#pencarian').focus();
  404.         break;
  405.       }
  406.       };
  407.      
  408.       function showTotal(){
  409.           var total = $('#total').val().replace(".", "").replace(".", "");
  410.           var sub_total = $('#sub_total').val().replace(".", "").replace(".", "");
  411.           $('#total').val(convertToRupiah((Number(total)+Number(sub_total))));
  412.       }
  413.      
  414.       function showKembali(str)
  415.       {
  416.           var total = $('#total').val().replace(".", "").replace(".", "");
  417.           var bayar = str.replace(".", "").replace(".", "");
  418.           var kembali = bayar-total;
  419.           $('#kembali').val(convertToRupiah(kembali));
  420.           if (kembali >= 0)
  421.           {
  422.               $('#selesai').removeAttr("disabled");
  423.           }
  424.           else
  425.           {
  426.               $('#selesai').attr("disabled","disabled");
  427.           }
  428.           if (total == 0)
  429.           {
  430.               $('#selesai').attr("disabled","disabled");
  431.           }
  432.     }
  433.        
  434.       function convertToRupiah(angka)
  435.       {
  436.           var rupiah = '';
  437.           var angkarev = angka.toString().split('').reverse().join('');
  438.           for(var i = 0; i < angkarev.length; i++)
  439.           if(i%3 == 0) rupiah += angkarev.substr(i,3)+'.';
  440.           return rupiah.split('',rupiah.length-1).reverse().join('');
  441.       }
  442.        
  443.        $(function(){
  444.             $("#pencarian").autocomplete({
  445.                 minLength: 1,
  446.                 delay : 400,
  447.                 source: function(request, response) {
  448.  
  449.                     jQuery.ajax({
  450.                         url: "<?php echo base_url() ?>option/cari_barang",
  451.                         data: {
  452.                           keyword : request.term
  453.                         },
  454.                         dataType: "json",
  455.                         success: function(data){
  456.                           response(data);
  457.                         }  
  458.                     })
  459.                 },
  460.                 select:  function(e, ui){
  461.                     var nama = ui.item.nama_barang;
  462.                     var code = ui.item.id_barang;
  463.                     $("#pencarian").val(code);
  464.                     $("#nama_barang").val(nama);
  465.                     $("#harga").val(convertToRupiah(ui.item.harga_jual));
  466.                     $("#jenis_promo").val(ui.item.jenis_promo);
  467.                     $("#potongan").val(ui.item.potongan);
  468.                     $("#harga_potongan").val(ui.item.harga_ahir);
  469.                     $('#qty').removeAttr("readonly");
  470.                     $('#qty').focus();
  471.                     return false;
  472.                 }
  473.             })
  474.             .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
  475.                return $( "<li>" )
  476.                .append( "<a>" + item.id_barang + " " + item.nama_barang + "</a>" )
  477.                .appendTo( ul );
  478.             };
  479.         });
  480.        
  481.         $('#selesai').click(function(){
  482.             var bayar=$('#bayar').val();
  483.             var kembali=$('#kembali').val();
  484.             $.ajax({
  485.                 url:"<?php echo base_url() ?>option/cetak_nota/",
  486.                 data:{bayar:bayar,kembali:kembali},
  487.                 method:"POST",
  488.                 success:function(data){
  489.                     $('#modalNota').modal('show');
  490.                     $('#isiModal').html(data);
  491.                     }
  492.                 });
  493.         });
  494.  
  495.         function selesai()
  496.         {
  497.           var bayar=$('#bayar').val();
  498.             var kembali=$('#kembali').val();
  499.             $.ajax({
  500.                 url:"<?php echo base_url() ?>option/cetak_nota/",
  501.                 data:{bayar:bayar,kembali:kembali},
  502.                 method:"POST",
  503.                 success:function(data){
  504.                     $('#modalNota').modal('show');
  505.                     $('#isiModal').html(data);
  506.                     }
  507.                 });
  508.         }
  509.        
  510.         function print_nota(){
  511.             window.print();
  512.             cetak_struk();
  513.         }
  514.        
  515.         function cetak_struk()
  516.         {
  517.             $.ajax({
  518.                 url : "<?php echo base_url() ?>option/shoping/",
  519.                 type: "post",
  520.                 dataType:"json",
  521.                 success:function(result){
  522.                     if(result.status == true){
  523.                         $('#modalNota').modal('hide');
  524.                         reload_table();
  525.                         $('.res').val('');
  526.             $('#pencarian').focus();
  527.                     }else{
  528.             alert('gagal melakukan transaksi')
  529.           }
  530.                 },
  531.                 error: function(err){
  532.                     alert('error transaksi')
  533.                 }
  534.             });
  535.         }
  536.        
  537.         function deletebarang(id,sub_total)
  538.         {
  539.             $.ajax({
  540.                 url : "<?= site_url('option/deletebarang')?>/"+id,
  541.                 type: "POST",
  542.                 dataType: "JSON",
  543.                 success: function(data){
  544.                     reload_table();
  545.                 },
  546.                 error: function (jqXHR, textStatus, errorThrown){
  547.                     alert('Gagal hapus barang');
  548.                 }
  549.             });
  550.             var ttl = $('#total').val().replace(".", "");
  551.             $('#total').val(convertToRupiah(ttl-sub_total));
  552.             showKembali($('#bayar').val());
  553.         }
  554.   </script>
  555.  
  556.   <!-- Modal -->
  557.         <div class="modal fade" id="modalNota" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  558.           <div class="modal-dialog modal-sm">
  559.             <div class="modal-content">
  560.                
  561.               <div class="modal-header">
  562.                 <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
  563.               </div>
  564.            
  565.               <div class="modal-body" id="isiModal">
  566.                
  567.               </div>
  568.            
  569.               <div class="modal-footer">
  570.                 <button type="button" class="btn btn-success" OnClick="print_nota()"><span class="fa fa-print"></span>  Cetak</button>
  571.                 <button type="button" class="btn btn-danger" data-dismiss="modal"><span class="fa fa-close"></span>  Tutup</button>
  572.                 </div>
  573.             </div>
  574.           </div>
  575.         </div>
  576.     <!-- akhir kode modal dialog -->
  577.  
  578.      
  579. </body>
  580.  
  581. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!