<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!-- Content Header (Page header) -->
</style>
<section class="content-header">
    <h1>
        Buat Pesanan
    </h1>
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
        <li><a href="#">Halaman Pesanan</a></li>
        <li><a href="#">Buat Pesanan</a></li>
    </ol>
</section>

<!-- Main content -->
<section class="content">

    <!-- Default box -->
    <div class="box">
        <div class="box-header with-border">
          <h3 class="box-title"></h3>
            <div class="box-tools pull-right">
                <button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
            </div>
        </div>
        <div class="box-body">
            <div class="box-body table-responsive no-padding">
              <form method="POST" action="<?php echo base_url().'tambah_pesanan/simpan'?>">
              <table class="table table-hover">
                <tr>
                  <td>Nama Agen</td>
                  <td>:</td>
                  <td><input type="text" id="autocomplete" class="auto" name="namaagen" autocomplete="off" placeholder="Nama Lengkap"></td>
                  <td>Nama Penerima</td>
                  <td>:</td>
                  <td><input type="text" id="napem" name="napem" placeholder="Nama Lengkap" readonly><input type="hidden" id="idpem" name="idpem"></td>
                </tr>
                <tr>
                  <td>Pengiriman</td>
                  <td>:</td>
                  <td><input type="radio" class="a" name="a" value="agen" checked> Agen</input>&nbsp;&nbsp;&nbsp;<input type="radio" class="a" value="dropship" name="a">   Dropship</input></td>
                  <td>Alamat</td>
                  <td>:</td>
                  <td><input type="text" id="alamatpem" name="alamatpem" placeholder="Alamat" readonly></td>
                </tr>
                <tr>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td>Provinsi</td>
                  <td>:</td>
                  <td><select id="provpem" name="provinsi" disabled>
                  <option>-- Provinsi --</option>
                  <?php
                  foreach($raja->rajaongkir->results as $mydata)
                  {
                  echo "<option value=".$mydata->province_id.">".$mydata->province."</option>";
                  }?>
                  </select></td>
                </tr>
                <tr>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td>Kota</td>
                  <td>:</td>
                  <td><select id="kotapem" name="kota" disabled>
                  <option>-- Kota --</option>
                  </select></td>
                </tr>
                <tr>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td>Kontak</td>
                  <td>:</td>
                  <td><input type="text" id="konpem" name="konpem" placeholder="Kontak" readonly></td>
                </tr>
              </table>
              <hr>
              <h3><i>Orders</i></h3>
               <table class="table table-hover order-list">
                <tr>
                  <th>Item</th>
                  <th>Harga</th>
                  <th>Qty</th>
                  <th>Diskon (%)</th>
                  <th>Total</th>
                  <th></th>
                </tr>
                <tr>
                  <td><input type="text" style="width: 200px;" autocomplete="off" id="item0" name="item[0]" placeholder="Item"></td>
                  <td><input type="text" style="width: 100px;" id="harga0" name="harga[0]" placeholder="Harga">  </td>
                  <td><input type="text" style="width: 50px;" id="qty0" name="qty[0]" placeholder="Qty" onkeyup="findTotal(); findJumlah()">  </td>
                  <td><input type="text" style="width: 100px;" id="diskon0" name="diskon[0]" placeholder="Diskon">  </td>
                  <td><input type="text" id="total0" name="total[0]" placeholder="Total"></td>
                  <td><input type="button" style="width: 50px;" class="btn btn-success" id="addrow" value="+"></input></td>
                </tr>
                <tr class="isi">
                </tr>
                <tr class="ongkir">
                  <td><select style="width: 200px;" name="kurir"><option>-- Pilih Kurir --</option><option value="jne">JNE</option><option value="tiki">TIKI</option><option value="pos">POS INDONESIA</option></select></td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td><input type="text" id="totalongkir" name="totalongkir" placeholder="Total"></td>
                  <td><input type="button" style="width: 50px;" class="ibtnDel btn btn-md btn-danger" value="-"></td>
                </tr>
              </table>
              <table class="table table-hover" border="0">
                <tr width="100%">
                  <td align="right" width="85%"><h4>Jumlah : Rp. <input id="totalsemua" name="totalsemua" style="width: 180px;" readonly></input></h4></td>
                  <td align="left" width="15%"><h4></h4></td>
                </tr>
                <tr>
                  <td align="right"><h3 class="box-title"><input type="submit" class="btn btn-success" value=" + Buat Pesanan"></input></h3></td>
                  <td><h3 class="box-title"> <a href="<?php echo site_url('Pesanan') ?>"><button type="button" class="btn btn-primary"><i class="fa fa-reply"></i> Kembali</button></a></h3></td>
                </tr>
              </table>
              </form>
            </div>
        </div><!-- /.box-body -->
        <div class="box-footer">
        </div><!-- /.box-footer-->
    </div><!-- /.box -->
</section>

<!-- AutoComplete -->
<script type="text/javascript">

$(document).ready(function () {
    var counter = 1;

    $("#addrow").on("click", function () {
        var newRow = $("<tr>").data("counter",counter);
        var cols = "";
        cols += '<td><input type="text" style="width: 200px;" id="item' + counter + '" name="item[' + counter + ']" autocomplete="off" placeholder="Item"></td>';
        cols += '<td><input type="text" style="width: 100px;" id="harga' + counter + '" name="harga[' + counter + ']" placeholder="Harga">  </td>';
        cols += '<td><input type="text" style="width: 50px;" id="qty' + counter + '" name="qty[' + counter + ']" placeholder="Qty" onkeyup="findTotal(); findJumlah()">  </td>';
        cols += '<td><input type="text" style="width: 100px;" id="diskon' + counter + '" name="diskon[' + counter + ']" placeholder="Diskon">  </td>';
        cols += '<td><input type="text" id="total' + counter + '" name="total[' + counter + ']" placeholder="Total"></td>';
        cols += '<td><input type="button" style="width: 50px;" class="ibtnDel btn btn-md btn-danger" value="-" onclick="findJumlah()"></td>';
        newRow.append(cols);
        newRow.insertBefore("tr.isi");
        $("#item"+counter).autocomplete({
                source: function(request, response) {
                $.ajax({
                url: "<?php echo site_url('Produk/data'); ?>",
                data: { id_barang: $("#item"+counter).val()},
                dataType: "json",
                type: "POST",
                success: function(data){
                console.log(data);
                response(data);
                }
            });
        },
    });
    $("#item"+counter).change(function(){
    var nmbarang = $(this).closest("tr").data("counter");
    $.ajax({
    url: '<?php echo site_url('Produk/tampil_where'); ?>',
    type: 'POST',
    dataType: 'json',
    data: {
            'nmbarang': nmbarang
          },
    success: function (barang) {
    console.log(barang);
    $("#harga"+counter).val(barang[0]['harga_barang']);
    }
    });
    });
        counter++;
    });

    $("table.order-list").on("click", ".ibtnDel", function (event) {
        $(this).closest("tr").remove();
        // counter -= 1;
    });


$(function () {
            $( "#item0" ).autocomplete({
                source: function(request, response) {
                    $.ajax({
                        url: "<?php echo site_url('Produk/data'); ?>",
                        data: { id_barang: $("#item0").val()},
                        dataType: "json",
                        type: "POST",
                        success: function(data){
                            response(data);
                        }
                    });
                },
            });
        });

$(function() {
      $("#item0").change(function(){
        var nmbarang = $("#item0").val();
        $.ajax({
          url: '<?php echo site_url('Produk/tampil_where'); ?>',
          type: 'POST',
          dataType: 'json',
          data: {
            'nmbarang': nmbarang
          },
          success: function (barang) {
            console.log(barang);
            $("#harga0").val(barang[0]['harga_barang']);
          }
        });
      });
    });

$(function () {
    $( "#autocomplete" ).autocomplete({
        source: function(request, response) {
            $.ajax({
                url: "<?php echo site_url('Pelanggan/data'); ?>",
                data: { kode: $("#autocomplete").val()},
                dataType: "json",
               type: "POST",
                success: function(data){
                    response(data);
                }
           });
        },
    });
});

$(function() {
      $("#autocomplete").change(function(){
        var namaagen = $("#autocomplete").val();
        $.ajax({
          url: '<?php echo site_url('Pelanggan/tampil_where'); ?>',
          type: 'POST',
          dataType: 'json',
          data: {
            'namaagen': namaagen
          },
          success: function (agen) {
            $("#napem").val(agen[0]['nama_pelanggan']);
            $("#idpem").val(agen[0]['id_pelanggan']);
            $("#alamatpem").val(agen[0]['alamat_jalan']);
            $("#konpem").val(agen[0]['kontak_pelanggan']);
          }
        });
      });
    });

$('#provpem').change(function(){
      //Mengambil value dari option select provinsi kemudian parameternya dikirim menggunakan ajax
      var prov = $('#provpem').val();
          $.ajax({
              type : 'GET',
              url : '<?php echo base_url().'Pelanggan/rajacity'?>',
              data :  'prov_id=' + prov,
          success: function (data) {
          //jika data berhasil didapatkan, tampilkan ke dalam option select kabupaten
          $("#kotapem").html(data);
        }
      });
    });
});
</script>

<!-- customJS -->
<script src="<?php echo base_url('assets/js/js-tambahpesanan/costum.js') ?>"></script>
<?php
$this->load->view('template/js');
$this->load->view('template/foot');
?>