<!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" style="background-color:#fff;">
		<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="height:35px;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: 3px 5px 5px;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 5px 5px;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: 3px 5px 5px;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>
						<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>
						<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>
						</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/home'?>">
							<i class="fa fa-home"></i>Home
						</a>
					</li>
					<li>
						<a href="<?php echo base_url().'mobile/menu/cart'?>">
							<i class="fa fa-shopping-cart"></i>Keranjang Belanja (<?=$this->cart->total_items();?>)
						</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/member/register'?>">
							<i class="fa fa-user"></i>Mendaftar
						</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>