<script src="<?= base_url() ?>assets/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="<?= base_url() ?>assets/jquery.chained.js"></script>
<link href="<?= base_url() ?>assets/select2.css" rel="stylesheet" />
<script src="<?= base_url() ?>assets/select2.js"></script>
<!-- Section -->
<section class="page-section">
    <div class="container">

        <div class="row">
            <div class="col-md-10 col-md-offset-1">

                <table class="table table-striped shopping-cart-table">
                    <tr>
                        <th class="hidden-xs">
                            Photo
                        </th>
                        <th>
                            Product
                        </th>
                        <th>
                            Q-ty
                        </th>
                        <th>
                            Berat
                        </th>
                        <th>
                            Total
                        </th>
                        <th>

                        </th>
                    </tr>
                    <?php
                    $tberat = 0;
                    $total = 0;
                    $t_qty = 0;
                    foreach ($this->cart->contents() as $items) {
                        ?>  
                        <tr>
                            <td class="hidden-xs">
                                <a href=""><img src="<?= base_url() ?>assets/product_image/<?= $items['foto'] ?>" alt="" width="70px"/></a>
                            </td>
                            <td>
                                <a href="#" title=""><?= $items['name'] ?></a>
                            </td>
                            <td>
                                <form class="form">
                                    <input type="number" disabled class="input-sm" style="width: 60px;" min="1" max="100" value="<?= $items['qty'] ?>" />
                                </form>
                            </td>
                            <td>
                                <a href="#" title=""><?= $items['berat'] ?></a>
                            </td>

                            <td>
                                <div style="float: left">Rp.</div>
                                <div style="float: right"><?= number_format($items['total'], 2) ?></div>
                            </td>
                            <td>
                                <a href="<?= base_url() ?>toko/deleteProduct/<?= $items['rowid'] ?>"><i class="fa fa-times"></i> <span class="hidden-xs">Remove</span></a>
                            </td>
                        </tr>
                        <?php
                        $tberat += $items['berat'];
                        $total += $items['total'];
                        $t_qty += $items['qty'];
                    }
                    ?>
                </table>

                <hr />
                <div class="row">
                    <form method="post" action="<?= base_url() ?>toko/simpanData" class="form">
                        <div class="col-sm-6">

                            <h3 class="small-title font-alt">Calculate Shipping</h3>
                            <div id="loading_ongkir" style="display: none;">
                                <i class="fa fa-refresh fa-spin fa-3x fa-fw"></i>
                                <span class="sr-only">Loading...</span>
                            </div>
                            <div id="show_ongkir">

                            </div>
                            <div class="mb-10">
                                <b>Berat : <?= $tberat ?> Kg</b>
                                <input name="t_berat" type="hidden" id="brt_ongkir" value="<?= $tberat ?>">
                            </div>
                            <div class="mb-10">
                                <?php
                                $province_ori = json_decode(GetProv(), TRUE);
                                echo "<select name='prov_origin' required class='form-control input-md select2' id='prov_origin'>";
                                echo "<option value=''>Pilih Provinsi...!!!</option>";
                                for ($i = 1; $i < count($province_ori['rajaongkir']['results']); $i++) {
                                    echo "<option value='" . $province_ori['rajaongkir']['results'][$i]['province_id'] . "' class='jne tiki pos all' >" . $province_ori['rajaongkir']['results'][$i]['province'] . "</option>";
                                }
                                echo "</select>";
                                ?>
                            </div>

                            <div class="mb-10">
                                <?php
                                $city_ori = json_decode(GetCity(), TRUE);
                                echo "<select name='city_origin' required class='form-control input-md select2' id='city_origin'>";
                                echo "<option class='' selected>Pilih Kota Asal...!!!</option>";
                                for ($x = 1; $x < count($city_ori['rajaongkir']['results']); $x++) {
                                    echo "<option value='" . $city_ori['rajaongkir']['results'][$x]['city_id'] . "' class='" . $city_ori['rajaongkir']['results'][$x]['province_id'] . "' >" . $city_ori['rajaongkir']['results'][$x]['type'] . " " . $city_ori['rajaongkir']['results'][$x]['city_name'] . "</option>";
                                }
                                echo "</select>";
                                ?>
                            </div>

                            <div class="mb-10">
                                <select class="form-control input-md" name="courir" id="kurir">
                                    <option value="jne">JNE</option>
                                    <option value="pos">POS</option>
                                    <option value="tiki">TIKI</option>
                                </select>
                            </div>
                            <input type="button" class="btn btn-info pull-right" id="button-quote" value="Cek Ongkir" onclick="cari_ongkir()">
                            <script>
                                function cari_ongkir() {
                                    var kota_tujuan = $('#city_origin').val();
                                    var berat = $('#brt_ongkir').val();
                                    var kurir = $('#kurir').val();
                                    $('#loading_ongkir').show();

                                    if (kota_tujuan != "" || berat != "" || kurir != "") {
                                        $.ajax({
                                            type: "POST",
                                            url: "<?= base_url() ?>toko/myOngkir",
                                            data: "city_destination=" + kota_tujuan + "&berat=" + berat + "&kurir=" + kurir,
                                            success: function(data) {
                                                $('#loading_ongkir').fadeOut();
                                                $("#show_ongkir").html(data);
                                            }
                                        });
                                    } else {
                                        alert("isi kota tujuan dan kurir yang digunakan..");
                                    }
                                }
                            </script>

                        </div>
                        <div class="col-sm-6 text align-right pt-10">

                            <h3 class="small-title font-alt">Payment Information</h3>
                            <div>
                                Cart subtotal: <strong>Rp. <?= number_format($total) ?></strong>
                            </div>

                            <div class="mb-10">
                                Shipping: <strong id="shipping">Rp. 0,-</strong>
                            </div>

                            <div class="lead mt-0 mb-30">
                                Order Total: <strong id="total_order">Rp. 0,-</strong>
                            </div>

                            <input type="hidden" id="t_qty" name="t_qty" value="<?= $t_qty ?>">
                            <input type="hidden" id="sub_total" name="sub_total" value="<?= $total ?>">
                            <input type="hidden" id="shipping_val" name="shipping" value="">
                            <input type="hidden" id="total_order_val" name="total_order" value="">
                            <div>
                                <button type="submit" href="" class="btn btn-mod btn-round btn-large">Proceed to Checkout</button>
                            </div>

                        </div>
                        <div style="clear: both"></div>

                    </form>
                </div>



            </div>
        </div>

    </div>
</section>
<!-- End Section -->

<div class="mb-100"></div>

<script>
    $(document).ready(function() {
        $('.select2').select2();

        $("#nm_pembeli").keydown(function() {
            var nm_pmbeli = $("#nm_pembeli").val();
            $("#nm_penerima").val(nm_pmbeli);
        });

        $("#no_telp_pembeli").keydown(function() {
            var nm_pmbeli = $("#no_telp_pembeli").val();
            $("#no_telp_penerima").val(nm_pmbeli);
        })

        $("#alamat_pembeli").keydown(function() {
            var nm_pmbeli = $("#alamat_pembeli").val();
            $("#alamat_penerima").val(nm_pmbeli);
        })
    });
</script>