<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
    <meta name="keywords" content="Djoedes by enambelasapp.my.id">
    <meta name="author" content="Suroto">
    <meta name="description" content="Djoedes by enambelasapp.my.id">
    <meta name="viewport" content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=yes" />

    <title>Keranjang Belanja</title>
    <link href="<?php echo base_url() . 'assets/img/logo.png' ?>" rel="shortcut icon" type="image/x-icon">

    <link type="text/css" rel="stylesheet" href="<?php echo base_url() . 'mobile/css/jquery.mmenu.all.css' ?>" />
    <link type="text/css" rel="stylesheet" href="<?php echo base_url() . 'mobile/css/style.css' ?>" />

    <link rel="apple-touch-icon" href="img/apple-touch-icon.png">
    <link rel="apple-touch-startup-image" href="img/apple-touch-startup-image.png">

    <script type="text/javascript" src="<?php echo base_url() . 'mobile/js/jquery.min.js' ?>"></script>
    <script type="text/javascript" src="<?php echo base_url() . 'mobile/js/jquery.mmenu.min.all.js' ?>"></script>
    <script type="text/javascript" src="<?php echo base_url() . 'mobile/js/jquery.easy-pie-chart.js' ?>"></script>
    <script type="text/javascript" src="<?php echo base_url() . 'mobile/js/o-script.js' ?>"></script>

    <link href="https://eorder.solariaresto.co.id/assets/css/core.min.css" rel="stylesheet">
    <link href="https://eorder.solariaresto.co.id/assets/css/app.min.css" rel="stylesheet">
    <link href="https://eorder.solariaresto.co.id/assets/css/style.min.css" rel="stylesheet">
    <link href="https://eorder.solariaresto.co.id/assets/vendor/easyautocomplete/dist/easy-autocomplete.min.css" rel="stylesheet">

    <!-- Favicons 
		<link rel="apple-touch-icon" href="https://eorder.solariaresto.co.id/assets/img/apple-touch-icon.png">
		<link rel="icon" href="https://eorder.solariaresto.co.id/assets/img/favicon.png"> -->
    <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css'>
    <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css'>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

    <!--  Open Graph Tags -->
    <!-- <meta property="og:title" content="The Admin Template of 2018!">
		<meta property="og:description" content="TheAdmin is a responsive, professional, and multipurpose admin template powered with Bootstrap 4.">
		<meta property="og:image" content="http://thetheme.io/theadmin/https://eorder.solariaresto.co.id/assets/img/og-img.jpg">
		<meta property="og:url" content="http://thetheme.io/theadmin/"> -->
    <meta name="twitter:card" content="summary_large_image">

    <style>
        body {
            background-image: linear-gradient(red, red, yellow);
            background-repeat: no-repeat;
            background-attachment: fixed;
            background-position: right bottom;

            font-size: 12px;
            font-weight: normal;
        }

        .preloader {
            background-color: rgba(255, 255, 255, 0.3) !important;
        }

        .spinner-dots span {
            background-color: #e0cdad;
        }

        .topbar {
            height: 45px;
        }

        .topbar-btn {
            padding: 0px;
            min-width: 36px;
        }

        .topbar-btns {
            padding-left: 10px;
        }

        .topbar-right {
            width: 100%;
        }

        .topbar-search .form-control {
            height: 30px;
            line-height: 32px;
            background-color: #eee;
            ;
            padding-left: 38px;
        }

        .topbar-search .lookup-placeholder {
            top: 3px;
        }

        .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
            margin: 0 2px;
        }

        .swiper-pagination-outside .swiper-wrapper {
            padding-bottom: 2px;
        }

        /*.figure {
					box-shadow: 0px 2px 8px rgba(0,0,0,0.15);
					border-radius: 4px;
			}*/
        .figure {
            box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.15);
            border-radius: 15px;
        }

        .figure-img {
            border-radius: 10px;
            margin-bottom: 0px;
            border: 5px solid white;

        }

        .figure-caption {
            font-size: 15px;
            padding: 0px 0px 0px;
            color: #222;
        }

        .figure-caption-custom {
            color: #4d5259;
            font-weight: normal !important;
        }

        .easy-autocomplete {
            position: unset !important;
        }

        .easy-autocomplete input {
            border-style: hidden;
            border-width: 0;
            box-shadow: none;
            color: inherit;
            float: none;
            padding: 10px 36px;
            height: 32px;
        }

        .easy-autocomplete-container ul {
            position: fixed;
            width: 100%;
            height: 100%;
            left: 0;
            top: 72px;
            border-top: none;
        }

        .lookup input:focus {
            background-color: #ffffff;
        }

        .lookup input {
            font-size: 13px;
        }

        .easy-autocomplete-container ul li,
        .easy-autocomplete-container ul .eac-category {
            border-bottom: 1px solid rgba(77, 82, 89, 0.07);
            font-size: 13px;
            color: #4d5259;
            padding: 10px 12px;
        }

        .easy-autocomplete-container ul li label {
            font-size: 15px;
            color: #b21b7a;
            margin-bottom: 0px;
        }

        .icon-label {
            position: relative;
            top: 15px !important;
            display: inline-block;
            float: none;
            margin: 0 0 0 -5px;
            vertical-align: top;
            font-size: 9px;
            font-weight: 400;
            padding-top: 3px;
            padding-bottom: 3px;
        }

        .topbar {
            background: linear-gradient(#f3f1d8, #e0cdad);
            border-radius: 0px 0px 20px 20px;
            box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.17);
        }

        .alert-gold {
            color: #b21b7a;
            border-radius: 10px;
            background: linear-gradient(#f3f1d8, #e0cdad);
            box-shadow: 1px 3px 6px rgba(0, 0, 0, 0.2);
        }

        .btn-gold {
            background: linear-gradient(#f3f1d8, #e0cdad);
            border-color: #e0cdad;
            color: #b21b7a;
            border-radius: 10px;
            box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
        }

        .btn-outline.btn-gold {
            color: #e0cdad;
            background: none;
            border-color: #e0cdad;
        }

        .btn-gold:active,
        .btn-red.active,
        .show>.btn-red.dropdown-toggle {
            background: linear-gradient(#f3f1d8, #e0cdad);
            border-color: #e0cdad;
            color: #b21b7a;
        }

        .btn-gold:hover {
            background: linear-gradient(#f3f1d8, #e0cdad);
            border-color: #e0cdad;
            color: #b21b7a;
        }

        .nav-tabs .nav-item.show .nav-link,
        .nav-tabs .nav-link.active {
            color: #b21b7a;
            background: linear-gradient(#f3f1d8, #e0cdad);
            border-color: #ddd #ddd #fff;
        }

        .nav-tabs .nav-link {
            color: #555;
        }

        .btn-group-lg>.btn,
        .btn-lg {
            font-size: 16px;
            font-weight: 500;
        }

        .btn-red:active,
        .btn-red.active,
        .show>.btn-red.dropdown-toggle {
            background-color: #b21b7a;
            border-color: #b21b7a;
            color: #fff;
        }

        .btn-red:hover {
            background-color: #b21b7a;
            border-color: #b21b7a;
            color: #fff;
        }

        .icon-label-order {
            position: relative;
            top: 12px !important;
            display: inline-block;
            float: none;
            margin: 0 0 0 -42px;
            vertical-align: top;
            font-size: 9px;
            font-weight: 400;
            padding-top: 3px;
            padding-bottom: 3px;
            color: #b21b7a
        }

        .icon-label-history {
            position: relative;
            top: 12px !important;
            display: inline-block;
            float: none;
            margin: 0 0 0 -28px;
            vertical-align: top;
            font-size: 9px;
            font-weight: 400;
            padding-top: 3px;
            padding-bottom: 3px;
            color: #b21b7a
        }

        .fab-fixed {
            position: fixed;
            box-shadow: 0px -5px 20px rgba(0, 0, 0, 0.14);
            padding: 8px 22px 20px;
            background-color: #fff;
            left: 0px;
            right: 0px;
            bottom: 0px;
        }

        .tab button {
            background-color: inherit;
            float: left;
            border: none;
            outline: none;
            cursor: pointer;
            padding: 14px 16px;
            transition: 0.3s;
            font-size: 17px;
        }

        /* Change background color of buttons on hover */
        .tab button:hover {
            background-color: #ddd;
        }

        /* Create an active/current tablink class */
        .tab button.active {
            background-color: #ccc;
        }

        /* Style the tab content */
        .tabcontent {
            display: none;
            padding: 6px 12px;
            border: 1px solid #ccc;
            border-top: none;
        }
    </style>

    <style>
        tbody {
            box-sizing: border-box;

        }

        *,
        *:before,
        *:after {
            box-sizing: inherit;

        }

        .column {
            float: left;
            width: 33.3%;
            margin-bottom: 0px;
            padding: 0 5px;

        }

        @media screen and (max-width: 650px) {
            .column {
                width: 100%;
                display: block;
            }
        }

        .card {
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);

        }

        .container {
            padding: 0 0px;
        }

        .container::after,
        .row::after {
            content: "";
            clear: both;
            display: table;
        }

        .title {
            color: grey;
        }

        .button {
            border: none;
            outline: 0;
            display: inline-block;
            padding: 3px;
            color: white;
            background-color: #000;
            text-align: center;
            cursor: pointer;
            width: 100%;
        }

        .button:hover {
            background-color: #555;
        }
    </style>
    <style>
        .modal-center .modal-dialog {
            margin: 0;
            width: 50%;
        }

        .ph-picture-6 {
            display: block;
        }

        .row-menu {
            flex-wrap: unset !important;
            height: 75px;
            overflow-y: hidden;
        }

        .col-4 {
            padding: 0px;
        }

        .col-3 {
            padding: 0px;
        }

        .d-flex-center {
            display: flex;
            min-height: 53px;
            align-items: center;
            justify-content: center;
        }

        .figure-caption-custom {
            color: #4d5259;
            font-weight: bolder;
        }
    </style>
    <style type="text/css">
        ::-webkit-scrollbar {
            display: none;
        }

        #scroller {
            overflow-y: hidden;
            overflow-x: hidden;
        }

        #scroller:hover {
            overflow-y: hidden;
            overflow-x: scroll;
            -ms-overflow-style: thin;
            scrollbar-width: thin;
        }

        .margin-bottom-50 {
            margin-bottom: 50px;
        }

        @media (min-width:320px) {

            /* smartphones, iPhone, portrait 480x320 phones */
            #scroller {
                overflow: scroll;
                -ms-overflow-style: none;
                scrollbar-width: none;
            }
        }

        @media (min-width:481px) {

            /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */
            #scroller {
                overflow: scroll;
                -ms-overflow-style: none;
                scrollbar-width: none;
            }
        }

        @media (min-width:641px) {

            /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */
            #scroller {
                overflow: scroll;
                -ms-overflow-style: none;
                scrollbar-width: none;
            }
        }

        /*.icon-label {
            position: relative;
            top: -18px !important;
            display: inline-block;
            float: none;
            margin: 0 0 0 -5px;
            vertical-align: top;
            font-size: 14px;
            font-weight: 400;
        }*/
    </style>


</head>

<body class="o-page">
    <div>
        <div id="header">
            <div class="header-content">
                <a href="#menu" class="p-link-home"><i class="fa fa-bars"></i></a>
                <a href="javascript:history.back();" class="p-link-back"><i class="fa fa-arrow-left"></i></a>
            </div>
        </div>
    </div>
    <div class="bannerPane banner-bg">
        <div class="overlay"></div>
        <div class="s-banner-content">
            Keranjang Belanja
        </div>
    </div>
    <div id="content">

        <article>

            <div class="prod-single-content" style="text-decoration:none;border-radius:10px;">
                <table style="width:100%;">
                    <thead>
                        <tr>
                            <th style="text-align:center;">Menu</th>
                            <th style="text-align:center;">Order</th>
                            <th style="text-align:center;">Harga</th>
                            <th style="text-align:center;">Total</th>
                        </tr>
                    </thead>
                    <tbody>
                        <form action="<?php echo base_url('mobile/menu/allmenu/') ?>" method="post">
                            <?php foreach ($list->result() as $key) : ?>
                                <?php
                                $gambar = $key->gambar;
                                $nama = $key->menu_nama;
                                $id = $key->kdbrg;

                                ?>
                                <article style="border-radius:15px;">
                                    <div class="article-img-pane">
                                        <img style="width:150px;height:180px;" src="<?php echo base_url() . '/assets/images/' . $gambar; ?>" />
                                    </div>
                                    <span style="font-size:15px"><?php echo $nama; ?></span>
                                    <span class="pull-right" style="text-align:right;text-decoration: none;display: inline-block; color: #313944;font-size:18px; ">
                                        <a href="<?php echo base_url('mobile/menu/delorder/') . '/' . $id ?>"><i class="fa fa-trash-o"></i></a>
                                    </span>
                                    <p />
                                    <span style="font-size:15px"><?php echo  number_format($key->harga); ?> </span>
                                    <p />
                                    <span class="flexbox flex-justified text-center" style="padding: 3px 4px;border-radius: 3px;width:100px;border-color: red;border-style: solid;background-color: red;font-size:13px;color:white;font-family: Segoe UI;font-weight:bold">
                                        <a href="<?php echo base_url('mobile/menu/min_list_order1/') . '/' . $id ?>" style="text-decoration: none;display: inline-block; color: #313944; " class="ajax text-center">
                                            <button class="btn btn-xs  btn-minus-list" type="button" style="padding:4px 4px;border-radius: 3px;width:25px;font-size:13px;color:white;font-family: Segoe UI;font-weight:bold" data-productid="<?php echo $id ?>" data-soldout="0"><i style="color:red" class="fa fa-minus"></i></button>
                                        </a>
                                        <span class="text-center total-cart-list" style="padding: 3px 4px;border-radius: 3px;width:45px;background-color: red;font-size:15px;color:white;font-family: Segoe UI;font-weight:bold"><?php echo number_format($key->qty); ?></span>
                                        <a href="<?php echo base_url('mobile/menu/add_list_order1') . '/' . $id ?>" style="text-decoration: none;display: inline-block; color: #313944;" class="ajax text-center">
                                            <button class="btn btn-xs btn-plus-list" type="button" style="padding: 4px 4px;border-radius: 3px;width:25px;font-size:13px;color:white;font-family: Segoe UI;font-weight:bold" data-productid="<?php echo $id ?>" data-soldout="0"><i style="color:red" class="fa fa-plus"></i></button>
                                        </a>
                                    </span>
                                </article>
                                <tr>
                                    <div class="container" style="padding: 3px 5px 5px;border-radius: 10px;">
                                        <td style="padding:0px;text-align:left;font-size:12px;font-family: Segoe UI, Arial, sans-serif;"><?php echo $key->menu_nama ?></td>
                                        <td style="padding:0px;text-align:center;font-size:12px;font-family: Segoe UI, Arial, sans-serif;"><?php echo number_format($key->qty); ?> x </td>
                                        <td style="padding:0px;text-align:right;font-size:12px;font-family: Segoe UI, Arial, sans-serif;"><?php echo number_format($key->harga); ?></td>
                                        <td style="padding:0px;text-align:right;font-size:12px;font-family: Segoe UI, Arial, sans-serif;font-weight:bold"><?php echo number_format($key->bruto); ?></td>
                                    </div>

                                </tr>
                                <?php
                                $tot_belanja += $key->bruto;
                                $tot_nppn += $key->nppn;
                                $tot_netto += $key->nppn + $key->bruto;
                                ?>
                            <?php
                            endforeach; ?>
                    </tbody>

                    <hr />
                    <tr>
                        <th style="text-align:right;font-size:12px;font-family: Segoe UI, Arial, sans-serif;font-weight:bold" colspan="3">Total</th>
                        <th style="text-align:right;font-size:13px;font-family: Segoe UI, Arial, sans-serif;font-weight:bold"><?php echo number_format($tot_belanja); ?></th>
                    </tr>
                    <tr>
                        <th style="text-align:right;font-size:12px;font-family: Segoe UI, Arial, sans-serif;font-weight:bold" colspan="3">Pb1/Pajak</th>
                        <th style="text-align:right;font-size:13px;font-family: Segoe UI, Arial, sans-serif;font-weight:bold"><?php echo number_format($tot_nppn); ?></th>
                    </tr>
                    <tr>
                        <th style="text-align:right;font-size:12px;font-family: Segoe UI, Arial, sans-serif;font-weight:bold" colspan="3">Netto</th>
                        <th style="text-align:right;font-size:13px;font-family: Segoe UI, Arial, sans-serif;font-weight:bold"><?php echo number_format($tot_netto); ?></th>
                    </tr>

                </table>
                <?php
                $nobukti = $this->session->userdata('nobukti');
                $torder = 0;
                $ord = $this->db->query("select sum(qty) as torder from tbl_belanja_detail where nobukti='$nobukti';");
                if ($ord->num_rows() > 0) {
                    $ordd = $ord->row_array();
                    $torder = $ordd['torder'];
                    if ($torder == null) {
                        $torder = 0;
                    }
                }
                ?>
                <p style="text-align:justify;"><b>Ada lagi Pesanan ?</b><a href="<?php echo base_url('mobile/menu/allmenu/') ?>"><button type="submit" class="o-buttons green" style="border:none;height:32px;border-radius:10px;"><b>Tambah</b></button></a>
                    <?php if ($torder == null) { ?>
                        <a style="text-decoration:none;border-radius:10px;" class="o-buttons blue pull-right" style="pointer-events: none">Check Out</a>
                    <?php } else { ?>
                        <a href="<?php echo base_url() . 'mobile/menu/check_out1' ?>" style="text-decoration:none;border-radius:10px;" class="o-buttons red pull-right">Check Out</a>
                    <?php } ?>
                    </form>
            </div>

        </article>

    </div>


    <!-- Menu navigation -->
    <nav id="menu">

        <ul>
            <li class="Selected">
                <a href="#close">
                    <i class="fa fa-times-circle"></i>
                </a>
            </li>
            <li>
                <a href="<?php echo base_url() . 'mobile/menu/allmenu' ?>">
                    <i class="fa fa-home"></i>Home
                </a>
            </li>
            <li>
                <a href="<?php echo base_url() . 'mobile/menu/belanja' ?>">
                    <i class="fa fa-shopping-cart"></i>Keranjang Belanja (<?= $torder ?>)
                </a>
            </li>


            <li>
                <a href="<?php echo base_url() . 'mobile/tracker' ?>">
                    <i class="fa fa-crosshairs"></i>Tracker
                </a>
            </li>
            <li>
                <a href="<?php echo base_url() . 'mobile/gallery' ?>">
                    <i class="fa fa-camera-retro"></i>Gallery
                </a>
            </li>


            <?php if ($this->session->userdata('online') == TRUE) : ?>
                <li>
                    <a href="<?php echo base_url() . 'mobile/konfirmasi' ?>">
                        <i class="fa fa-exchange"></i>Konfirmasi
                    </a>
                </li>

                <li>
                    <a href="<?php echo base_url() . 'mobile/myfood' ?>">
                        <i class="fa fa-cutlery"></i>My Food
                    </a>
                </li>

                <li>
                    <a href="<?php echo base_url() . 'mobile/member/logout' ?>">
                        <i class="fa fa-sign-out"></i>Logout
                    </a>
                </li>
            <?php else : ?>
                <li>
                    <a href="<?php echo base_url() . 'mobile/member' ?>">
                        <i class="fa fa-sign-in"></i>Login
                    </a>
                </li>
            <?php endif; ?>
        </ul>

    </nav>


</body>

</html>