wewmantap
/
resto-dhepot
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add: Diskon satuan, Keterangan

auth
mikhailkusuma 2024-01-20 01:48:52 +07:00
parent 19b0f783d3
commit f0eae4f1e8
1 changed files with 770 additions and 775 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

303
resources/views/pages/Kasir/transaksi.blade.php
View File

@ -20,60 +20,37 @@
@endsection --}} @endsection --}}
@section('content') @section('content')
<div class="container" style="display: contents;"> <div class="container" style="display: contents;">
<div class="row" style="padding: 5px"> <div class="row" style="padding: 5px">
<div class="col-lg-8"> <div class="col-xl-8 col-lg-6 col-md-6 col-sm-12">
<div class="card card-primary card-outline card-outline-tabs"> <div class="card card-primary card-outline card-outline-tabs">
<div class="card-header p-0 border-bottom-0"> <div class="card-header p-0 border-bottom-0">
<ul class="nav nav-tabs" id="custom-tabs-four-tab" role="tablist"> <ul class="nav nav-tabs" id="custom-tabs-four-tab" role="tablist">
@foreach ($KelompokKategori as $key => $item) @foreach ($KelompokKategori as $key => $item)
<li class="nav-item"> <li class="nav-item">
<a class="nav-link @if ($key == 0) active @endif" <a class="nav-link @if ($key == 0) active @endif" id="custom-tabs-four-{{ $item->kode_kelompok_kategori }}-tab" data-toggle="pill" href="#custom-tabs-four-{{ $item->kode_kelompok_kategori }}" role="tab" aria-controls="custom-tabs-four-{{ $item->kode_kelompok_kategori }}" aria-selected="true">{{ $item->nama_kelompok_kategori }}</a>
id="custom-tabs-four-{{ $item->kode_kelompok_kategori }}-tab" data-toggle="pill"
href="#custom-tabs-four-{{ $item->kode_kelompok_kategori }}" role="tab"
aria-controls="custom-tabs-four-{{ $item->kode_kelompok_kategori }}"
aria-selected="true">{{ $item->nama_kelompok_kategori }}</a>
</li> </li>
@endforeach @endforeach
</ul> </ul>
</div> </div>
<div class="card-body" id="batasitinggi" <div class="card-body" id="batasitinggi" style="height:720px;overflow-y:scroll;margin-bottom: 5px;padding-top: 2px;padding-bottom: 2px">
style="height:720px;overflow-y:scroll;margin-bottom: 5px;padding-top: 2px;padding-bottom: 2px">
<div class="tab-content" id="custom-tabs-four-tabContent"> <div class="tab-content" id="custom-tabs-four-tabContent">
@foreach ($KelompokKategori as $key => $item) @foreach ($KelompokKategori as $key => $item)
<div class="tab-pane fade show @if ($key == 0) active @endif" <div class="tab-pane fade show @if ($key == 0) active @endif" id="custom-tabs-four-{{ $item->kode_kelompok_kategori }}" role="tabpanel" aria-labelledby="custom-tabs-four-{{ $item->kode_kelompok_kategori }}-tab">
id="custom-tabs-four-{{ $item->kode_kelompok_kategori }}" role="tabpanel"
aria-labelledby="custom-tabs-four-{{ $item->kode_kelompok_kategori }}-tab">
<div class="row"> <div class="row">
@if ($item->kode_kelompok_kategori == 'PAK-SKOM') @if ($item->kode_kelompok_kategori == 'PAK-SKOM')
<div class="col" style="padding: 0px"> <div class="col" style="padding: 0px">
<div class="row" style="padding: 0px"> <div class="row" style="padding: 0px">
<div class="col-4 col-sm-3" style="margin-left: 0px;padding-left: 0px;"> <div class="col-4 col-sm-3" style="margin-left: 0px;padding-left: 0px;">
<div class="nav flex-column nav-tabs h-100" id="vert-tabs-tab" <div class="nav flex-column nav-tabs h-100" id="vert-tabs-tab" role="tablist" aria-orientation="vertical">
role="tablist" aria-orientation="vertical">
<a class="nav-link active" id="vert-tabs-nasi-tab" <a class="nav-link active" id="vert-tabs-nasi-tab" data-toggle="pill" href="#vert-tabs-nasi" role="tab" aria-controls="vert-tabs-nasi" aria-selected="true">Nasi</a>
data-toggle="pill" href="#vert-tabs-nasi" role="tab" <a class="nav-link" id="vert-tabs-telur-tab" data-toggle="pill" href="#vert-tabs-telur" role="tab" aria-controls="vert-tabs-telur" aria-selected="false">Telur</a>
aria-controls="vert-tabs-nasi" aria-selected="true">Nasi</a> <a class="nav-link" id="vert-tabs-sambel-tab" data-toggle="pill" href="#vert-tabs-sambel" role="tab" aria-controls="vert-tabs-sambel" aria-selected="false">Sambel</a>
<a class="nav-link" id="vert-tabs-telur-tab" data-toggle="pill" <a class="nav-link" id="vert-tabs-topping-tab" data-toggle="pill" href="#vert-tabs-topping" role="tab" aria-controls="vert-tabs-topping" aria-selected="false">Topping</a>
href="#vert-tabs-telur" role="tab" <a class="nav-link" id="vert-tabs-free-tab" data-toggle="pill" href="#vert-tabs-free" role="tab" aria-controls="vert-tabs-free" aria-selected="false">Free</a>
aria-controls="vert-tabs-telur"
aria-selected="false">Telur</a>
<a class="nav-link" id="vert-tabs-sambel-tab" data-toggle="pill"
href="#vert-tabs-sambel" role="tab"
aria-controls="vert-tabs-sambel"
aria-selected="false">Sambel</a>
<a class="nav-link" id="vert-tabs-topping-tab"
data-toggle="pill" href="#vert-tabs-topping" role="tab"
aria-controls="vert-tabs-topping"
aria-selected="false">Topping</a>
<a class="nav-link" id="vert-tabs-free-tab" data-toggle="pill"
href="#vert-tabs-free" role="tab"
aria-controls="vert-tabs-free"
aria-selected="false">Free</a>
<div class="card card-primary card-outline" <div class="card card-primary card-outline" style="margin-top: auto;margin-right: 5px;height: auto;">
style="margin-top: auto;margin-right: 5px;height: auto;">
<div class="card-header"> <div class="card-header">
<h5 class="card-title m-0" id="nama-paket"> <h5 class="card-title m-0" id="nama-paket">
Paket Menu Terpilih Paket Menu Terpilih
@ -86,8 +63,7 @@
</li> </li>
</ul> </ul>
</div> </div>
<a class="btn btn-primary disabled" <a class="btn btn-primary disabled" id="select-ordered-menus" onclick="cariPaket()">Pilih
id="select-ordered-menus" onclick="cariPaket()">Pilih
Paket Menu Paket Menu
</a> </a>
</div> </div>
@ -96,33 +72,26 @@
<div class="col-8 col-sm-9" style="padding: 0px;"> <div class="col-8 col-sm-9" style="padding: 0px;">
<div class="card-body" style="height:700px;overflow-y:scroll;"> <div class="card-body" style="height:700px;overflow-y:scroll;">
<div class="tab-content" id="vert-tabs-tabContent"> <div class="tab-content" id="vert-tabs-tabContent">
<div class="tab-pane text-left fade show active" <div class="tab-pane text-left fade show active" id="vert-tabs-nasi" role="tabpanel" aria-labelledby="vert-tabs-nasi-tab">
id="vert-tabs-nasi" role="tabpanel"
aria-labelledby="vert-tabs-nasi-tab">
<div class="row"> <div class="row">
@foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot) @foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot)
@if ($kelompokKategoriPivot->produk->urutan == 1) @if ($kelompokKategoriPivot->produk->urutan == 1)
<div class="col-lg-4"> <div class="col-lg-4">
<div <div class="card card-primary card-outline">
class="card card-primary card-outline">
<div class="card-header"> <div class="card-header">
<h5 class="card-title m-0"> <h5 class="card-title m-0">
{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }} {{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}
</h5> </h5>
</div> </div>
<div class="card-body"> <div class="card-body">
<img style="width: 100%;height: 200px;object-fit: cover;" <img style="width: 100%;height: 200px;object-fit: cover;" src="
src="
@if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }} @if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }}
@else @else
{{ asset('assets/images/menu_image.jpeg') }} @endif {{ asset('assets/images/menu_image.jpeg') }} @endif
" " alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}">
alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}">
</div> </div>
<a class="btn btn-primary" <a class="btn btn-primary" id="ordered-menus" onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} )">Pilih
id="ordered-menus"
onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} )">Pilih
Paket Paket
</a> </a>
</div> </div>
@ -131,32 +100,26 @@
@endforeach @endforeach
</div> </div>
</div> </div>
<div class="tab-pane fade" id="vert-tabs-telur" <div class="tab-pane fade" id="vert-tabs-telur" role="tabpanel" aria-labelledby="vert-tabs-telur-tab">
role="tabpanel" aria-labelledby="vert-tabs-telur-tab">
<div class="row"> <div class="row">
@foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot) @foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot)
@if ($kelompokKategoriPivot->produk->urutan == 2) @if ($kelompokKategoriPivot->produk->urutan == 2)
<div class="col-lg-4"> <div class="col-lg-4">
<div <div class="card card-primary card-outline">
class="card card-primary card-outline">
<div class="card-header"> <div class="card-header">
<h5 class="card-title m-0"> <h5 class="card-title m-0">
{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }} {{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}
</h5> </h5>
</div> </div>
<div class="card-body"> <div class="card-body">
<img style="width: 100%;height: 200px;object-fit: cover;" <img style="width: 100%;height: 200px;object-fit: cover;" src="
src="
@if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }} @if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }}
@else @else
{{ asset('assets/images/menu_image.jpeg') }} @endif {{ asset('assets/images/menu_image.jpeg') }} @endif
" " alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}">
alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}">
</div> </div>
<a class="btn btn-primary" <a class="btn btn-primary" id="ordered-menus" onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} )">Pilih
id="ordered-menus"
onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} )">Pilih
Paket Paket
</a> </a>
</div> </div>
@ -165,33 +128,26 @@
@endforeach @endforeach
</div> </div>
</div> </div>
<div class="tab-pane fade" id="vert-tabs-sambel" <div class="tab-pane fade" id="vert-tabs-sambel" role="tabpanel" aria-labelledby="vert-tabs-sambel-tab">
role="tabpanel"
aria-labelledby="vert-tabs-sambel-tab">
<div class="row"> <div class="row">
@foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot) @foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot)
@if ($kelompokKategoriPivot->produk->urutan == 3) @if ($kelompokKategoriPivot->produk->urutan == 3)
<div class="col-lg-4"> <div class="col-lg-4">
<div <div class="card card-primary card-outline">
class="card card-primary card-outline">
<div class="card-header"> <div class="card-header">
<h5 class="card-title m-0"> <h5 class="card-title m-0">
{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }} {{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}
</h5> </h5>
</div> </div>
<div class="card-body"> <div class="card-body">
<img style="width: 100%;height: 200px;object-fit: cover;" <img style="width: 100%;height: 200px;object-fit: cover;" src="
src="
@if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }} @if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }}
@else @else
{{ asset('assets/images/menu_image.jpeg') }} @endif {{ asset('assets/images/menu_image.jpeg') }} @endif
" " alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}">
alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}">
</div> </div>
<a class="btn btn-primary" <a class="btn btn-primary" id="ordered-menus" onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} )">Pilih
id="ordered-menus"
onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} )">Pilih
Paket Paket
</a> </a>
</div> </div>
@ -200,33 +156,26 @@
@endforeach @endforeach
</div> </div>
</div> </div>
<div class="tab-pane fade" id="vert-tabs-topping" <div class="tab-pane fade" id="vert-tabs-topping" role="tabpanel" aria-labelledby="vert-tabs-topping-tab">
role="tabpanel"
aria-labelledby="vert-tabs-topping-tab">
<div class="row"> <div class="row">
@foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot) @foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot)
@if ($kelompokKategoriPivot->produk->urutan == 4) @if ($kelompokKategoriPivot->produk->urutan == 4)
<div class="col-lg-4"> <div class="col-lg-4">
<div <div class="card card-primary card-outline">
class="card card-primary card-outline">
<div class="card-header"> <div class="card-header">
<h5 class="card-title m-0"> <h5 class="card-title m-0">
{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }} {{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}
</h5> </h5>
</div> </div>
<div class="card-body"> <div class="card-body">
<img style="width: 100%;height: 200px;object-fit: cover;" <img style="width: 100%;height: 200px;object-fit: cover;" src="
src="
@if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }} @if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }}
@else @else
{{ asset('assets/images/menu_image.jpeg') }} @endif {{ asset('assets/images/menu_image.jpeg') }} @endif
" " alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}">
alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}">
</div> </div>
<a class="btn btn-primary" <a class="btn btn-primary" id="ordered-menus" onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} )">Pilih
id="ordered-menus"
onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} )">Pilih
Paket Paket
</a> </a>
</div> </div>
@ -235,32 +184,26 @@
@endforeach @endforeach
</div> </div>
</div> </div>
<div class="tab-pane fade" id="vert-tabs-free" <div class="tab-pane fade" id="vert-tabs-free" role="tabpanel" aria-labelledby="vert-tabs-free-tab">
role="tabpanel" aria-labelledby="vert-tabs-free-tab">
<div class="row"> <div class="row">
@foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot) @foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot)
@if ($kelompokKategoriPivot->produk->urutan == 5) @if ($kelompokKategoriPivot->produk->urutan == 5)
<div class="col-lg-4"> <div class="col-lg-4">
<div <div class="card card-primary card-outline">
class="card card-primary card-outline">
<div class="card-header"> <div class="card-header">
<h5 class="card-title m-0"> <h5 class="card-title m-0">
{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }} {{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}
</h5> </h5>
</div> </div>
<div class="card-body"> <div class="card-body">
<img style="width: 100%;height: 200px;object-fit: cover;" <img style="width: 100%;height: 200px;object-fit: cover;" src="
src="
@if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }} @if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }}
@else @else
{{ asset('assets/images/menu_image.jpeg') }} @endif {{ asset('assets/images/menu_image.jpeg') }} @endif
" " alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}">
alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}">
</div> </div>
<a class="btn btn-primary" <a class="btn btn-primary" id="ordered-menus" onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} )">Pilih
id="ordered-menus"
onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} )">Pilih
Paket Paket
</a> </a>
</div> </div>
@ -277,8 +220,7 @@
@else @else
@foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot) @foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot)
<div class="col-lg-4"> <div class="col-lg-4">
<div class="card card-primary card-outline btn" <div class="card card-primary card-outline btn" onclick="aadMenu( {{ $kelompokKategoriPivot->produk }} )">
onclick="aadMenu( {{ $kelompokKategoriPivot->produk }} )">
<div class="card-header"> <div class="card-header">
<h5 class="card-title m-0"> <h5 class="card-title m-0">
{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }} {{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}
@ -286,20 +228,16 @@
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="col"> <div class="col">
<img style="width: 100%;height: 200px;object-fit: cover;" <img style="width: 100%;height: 200px;object-fit: cover;" src="
src="
@if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }} @if ($kelompokKategoriPivot->produk->gambar_produk != null) {{ asset('storage/' . $kelompokKategoriPivot->produk->gambar_produk) }}
@else @else
{{ asset('assets/images/menu_image.jpeg') }} @endif {{ asset('assets/images/menu_image.jpeg') }} @endif
" " alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}">
alt="{{ $kelompokKategoriPivot->produk->nama_produk ?? '' }}"> <div class="row" style="margin: 5px;display: flex;align-items: center;align-content: center;">
<div class="row"
style="margin: 5px;display: flex;align-items: center;align-content: center;">
<h5 class="col-6"> <h5 class="col-6">
{{ convert_to_rupiah($kelompokKategoriPivot->produk->harga_produk) }} {{ convert_to_rupiah($kelompokKategoriPivot->produk->harga_produk) }}
</h5> </h5>
<a class="col-6 btn btn-primary" <a class="col-6 btn btn-primary" id="ordered-menus">Pesan</a>
id="ordered-menus">Pesan</a>
</div> </div>
</div> </div>
</div> </div>
@ -316,7 +254,7 @@
</div> </div>
</div> </div>
<!-- /.col-md-6 --> <!-- /.col-md-6 -->
<div class="col-lg-4"> <div class="col-xl-4 col-lg-6 col-md-6 col-sm-12">
<div class="card card-primary card-outline"> <div class="card card-primary card-outline">
<div class="card-header"> <div class="card-header">
<h5 class="col-lg-6 card-title m-0">Kode Pesanan <h5 class="col-lg-6 card-title m-0">Kode Pesanan
@ -330,9 +268,10 @@
<table class="table table-bordered table-striped" id="order-menus" width="100%"> <table class="table table-bordered table-striped" id="order-menus" width="100%">
<thead style="background-color: lightgray"> <thead style="background-color: lightgray">
<tr> <tr>
<th width="60%" class="text-center">Menu</th> <th class="text-center">Menu</th>
<th>Qty</th> <th width="110px">Qty</th>
<th width="10%">⚙️</th> <th width="60px">Diskon (%)</th>
<th width="30px">⚙️</th>
</tr> </tr>
</thead> </thead>
<tbody id="tbody-order-menus"> <tbody id="tbody-order-menus">
@ -340,7 +279,7 @@
<tfoot style="background-color: lightgray"> <tfoot style="background-color: lightgray">
<tr> <tr>
<th class="text-center">Total</th> <th class="text-center">Total</th>
<th colspan="2"> <th colspan="3">
<span class="row"> <span class="row">
<span class="col-6">Rp.</span> <span class="col-6">Rp.</span>
<span class="col-6" style="text-align: right" id="total">0</span> <span class="col-6" style="text-align: right" id="total">0</span>
@ -350,7 +289,7 @@
</tr> </tr>
<tr> <tr>
<th class="text-center">Diskon (%)</th> <th class="text-center">Diskon (%)</th>
<th colspan="2"> <th colspan="3">
<div class="input-group input-group-sm"> <div class="input-group input-group-sm">
<input type="number" name="diskon" class="form-control rounded-0"> <input type="number" name="diskon" class="form-control rounded-0">
</div> </div>
@ -358,7 +297,7 @@
</tr> </tr>
<tr> <tr>
<th class="text-center">Grand Total</th> <th class="text-center">Grand Total</th>
<th colspan="2"> <th colspan="3">
<span class="row"> <span class="row">
<span class="col-6">Rp.</span> <span class="col-6">Rp.</span>
<span class="col-6" style="text-align: right" id="total-diskon">0</span> <span class="col-6" style="text-align: right" id="total-diskon">0</span>
@ -368,16 +307,15 @@
</tr> </tr>
<tr> <tr>
<th class="text-center">Bayar</th> <th class="text-center">Bayar</th>
<th colspan="2"> <th colspan="3">
<div class="input-group input-group-sm"> <div class="input-group input-group-sm">
<input type="text" name="nominal-bayar" class="form-control rounded-0" <input type="text" name="nominal-bayar" class="form-control rounded-0" required id="nominal-bayar">
required id="nominal-bayar">
</div> </div>
</th> </th>
</tr> </tr>
<tr> <tr>
<th class="text-center">Kembali</th> <th class="text-center">Kembali</th>
<th colspan="2"> <th colspan="3">
<span class="row"> <span class="row">
<span class="col-6">Rp.</span> <span class="col-6">Rp.</span>
<span class="col-6" style="text-align: right" id="kembali">0</span> <span class="col-6" style="text-align: right" id="kembali">0</span>
@ -386,18 +324,15 @@
</th> </th>
</tr> </tr>
<tr> <tr>
<th colspan="3"> <th colspan="4">
<span class="row"> <span class="row">
<input type="text" name="nama-pemesan" class="form-control rounded-0" <input type="text" name="nama-pemesan" class="form-control rounded-0" placeholder="Nama Pemesan" id="nama-pemesan" required>
placeholder="Nama Pemesan" id="nama-pemesan" required> <input type="text" name="keterangan-pesanan" placeholder="Keterangan Pesanan" class="form-control rounded-0" id="keterangan-pesanan">
<input type="text" name="keterangan-pesanan"
placeholder="Keterangan Pesanan" class="form-control rounded-0"
id="keterangan-pesanan">
</span> </span>
</th> </th>
</tr> </tr>
<tr style="background-color: white"> <tr style="background-color: white">
<th colspan="3"> <th colspan="4">
<button class="btn btn-primary btn-block" id="pesan-bayar">Bayar</button> <button class="btn btn-primary btn-block" id="pesan-bayar">Bayar</button>
</th> </th>
</tr> </tr>
@ -410,10 +345,10 @@
<!-- /.col-md-6 --> <!-- /.col-md-6 -->
</div> </div>
<!-- /.row --> <!-- /.row -->
</div><!-- /.container-fluid --> </div><!-- /.container-fluid -->
<div class="modal fade" id="modal-default"> <div class="modal fade" id="modal-default">
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
@ -428,21 +363,21 @@
<!-- /.modal-content --> <!-- /.modal-content -->
</div> </div>
<!-- /.modal-dialog --> <!-- /.modal-dialog -->
</div> </div>
@endsection @endsection
@push('styles') @push('styles')
<!-- Toastr --> <!-- Toastr -->
<style> <style>
</style> </style>
<link rel="stylesheet" href="{{ asset('assets/plugins/toastr/toastr.min.css') }}"> <link rel="stylesheet" href="{{ asset('assets/plugins/toastr/toastr.min.css') }}">
@endpush @endpush
@push('scripts') @push('scripts')
<!-- Toastr --> <!-- Toastr -->
<script src="{{ asset('assets/plugins/toastr/toastr.min.js') }}"></script> <script src="{{ asset('assets/plugins/toastr/toastr.min.js') }}"></script>
<script> <script>
// set interval waktu pesanan // set interval waktu pesanan
function showTime() { function showTime() {
var date = new Date(), var date = new Date(),
@ -475,6 +410,7 @@
// make function add menu to table and calculate qty and total price menu ordered and check menu ordered is exist or not in tbody table order-menus insert this in // make function add menu to table and calculate qty and total price menu ordered and check menu ordered is exist or not in tbody table order-menus insert this in
function aadMenu(params) { function aadMenu(params) {
console.log(params);
var table = document.getElementById("order-menus"); var table = document.getElementById("order-menus");
var menu = params; var menu = params;
var menuId = menu.id; var menuId = menu.id;
@ -497,28 +433,48 @@
if (isExist) { if (isExist) {
var qty = table.rows[index].getAttribute('data-qty'); var qty = table.rows[index].getAttribute('data-qty');
var diskonSatuan = table.rows[index].getAttribute('data-diskon-satuan');
var total = table.rows[index].getAttribute('data-total'); var total = table.rows[index].getAttribute('data-total');
qty = parseInt(qty) + 1; qty = parseInt(qty) + 1;
total = parseInt(total) + parseInt(menuPrice); diskonSatuan = parseInt(diskonSatuan);
total = (parseInt(total) + parseInt(menuPrice)) - ((parseInt(total) + parseInt(menuPrice)) * (diskonSatuan / 100));
table.rows[index].setAttribute('data-qty', qty); table.rows[index].setAttribute('data-qty', qty);
table.rows[index].setAttribute('data-diskon-satuan', diskonSatuan);
table.rows[index].setAttribute('data-total', total); table.rows[index].setAttribute('data-total', total);
table.rows[index].cells[0].innerHTML = `
<td>
${params.nama_produk}
<br>
${(diskonSatuan > 0) ? '<small class="text-primary"><s>Rp. ' + harga + '</s></small> | <small class="text-danger">Rp. ' + total + '</small>' : '<small class="text-primary">Rp. ' + total + '</small>'}
<div class="input-group input-group-sm mt-1">
<input type="text" name="keterangan_satuan" class="form-control rounded-0" placeholder="Keterangan..">
</div>
</td>
`;
table.rows[index].cells[1].innerHTML = ` table.rows[index].cells[1].innerHTML = `
<td class="text-center"> <td class="text-center">
<div class="input-group input-group-sm"> <div class="input-group input-group-sm">
<span class="input-group-append"> <span class="input-group-append">
<button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${params.id})"><b>-</b></button> <button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${params.id}, '${params.nama_produk}')"><b>-</b></button>
</span> </span>
<input type="number" name="bayar" class="form-control rounded-0" value="${qty}"> <input type="text" name="bayar" class="form-control rounded-0" readonly value="${qty}">
<span class="input-group-append"> <span class="input-group-append">
<button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${params.id})">+</button> <button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${params.id}, '${params.nama_produk}')">+</button>
</span> </span>
</div> </div>
</td> </td>
`; `;
table.rows[index].cells[2].innerHTML = ` table.rows[index].cells[2].innerHTML = `
<td class="text-center">
<div class="input-group input-group-sm">
<input type="number" name="diskon_satuan" class="form-control rounded-0" value="0">
</div>
</td>
`;
table.rows[index].cells[3].innerHTML = `
<td class="text-center"> <td class="text-center">
<button class="btn btn-danger btn-sm" onclick="deleteMenu(${params.id})"> <button class="btn btn-danger btn-sm" onclick="deleteMenu(${params.id})">
<i class="fas fa-trash"></i> <i class="fas fa-trash"></i>
@ -529,23 +485,31 @@
$('#modal-default').modal('hide'); $('#modal-default').modal('hide');
} else { } else {
$('#tbody-order-menus').append(` $('#tbody-order-menus').append(`
<tr id="row-${params.id}" data-id="${params.id}" data-nama="${params.nama_produk}" data-harga="${params.harga_produk}" data-qty="1" data-total="${params.harga_produk}"> <tr id="row-${params.id}" data-id="${params.id}" data-nama="${params.nama_produk}" data-harga="${params.harga_produk}" data-qty="1" data-diskon-satuan="0" data-total="${params.harga_produk}">
<td> <td>
${params.nama_produk} ${params.nama_produk}
<br> <br>
<small class="text-danger">Rp. ${params.harga_produk}</small> <small class="text-primary">Rp. ${params.harga_produk}</small>
<div class="input-group input-group-sm mt-1">
<input type="text" name="keterangan_satuan" class="form-control rounded-0" placeholder="Keterangan..">
</div>
</td> </td>
<td class="text-center"> <td class="text-center">
<div class="input-group input-group-sm"> <div class="input-group input-group-sm">
<span class="input-group-append"> <span class="input-group-append">
<button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${params.id})"><b>-</b></button> <button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${params.id}, '${params.nama_produk}')"><b>-</b></button>
</span> </span>
<input type="number" name="bayar" class="form-control rounded-0" value="${menuQty}"> <input type="text" name="bayar" class="form-control rounded-0" readonly value="${menuQty}">
<span class="input-group-append"> <span class="input-group-append">
<button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${params.id})">+</button> <button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${params.id}, '${params.nama_produk}')">+</button>
</span> </span>
</div> </div>
</td> </td>
<td class="text-center">
<div class="input-group input-group-sm">
<input type="number" name="diskon_satuan" class="form-control rounded-0" value="0">
</div>
</td>
<td class="text-center"> <td class="text-center">
<button class="btn btn-danger btn-sm" onclick="deleteMenu(${params.id})"> <button class="btn btn-danger btn-sm" onclick="deleteMenu(${params.id})">
<i class="fas fa-trash"></i> <i class="fas fa-trash"></i>
@ -585,7 +549,8 @@
for (var i = 1, row; row = table.rows[i]; i++) { for (var i = 1, row; row = table.rows[i]; i++) {
var harga = row.getAttribute('data-harga'); var harga = row.getAttribute('data-harga');
var qty = row.getAttribute('data-qty'); var qty = row.getAttribute('data-qty');
var total = total + (harga * qty); var diskonSatuan = row.getAttribute('data-diskon-satuan');
var total = total + ((harga * qty) - ((harga * qty) * (diskonSatuan / 100)));
} }
var ribuantotal = toRupiah(total); var ribuantotal = toRupiah(total);
@ -602,7 +567,7 @@
} }
// increment qty menu ordered // increment qty menu ordered
function incrementMenu(params) { function incrementMenu(params, nama_produk) {
var table = document.getElementById("order-menus"); var table = document.getElementById("order-menus");
var index = 0; var index = 0;
@ -615,24 +580,38 @@
} }
var qty = table.rows[index].getAttribute('data-qty'); var qty = table.rows[index].getAttribute('data-qty');
var diskonSatuan = table.rows[index].getAttribute('data-diskon-satuan');
var total = table.rows[index].getAttribute('data-total'); var total = table.rows[index].getAttribute('data-total');
var harga = table.rows[index].getAttribute('data-harga'); var harga = table.rows[index].getAttribute('data-harga');
qty = parseInt(qty) + 1; qty = parseInt(qty) + 1;
total = parseInt(total) + parseInt(harga); diskonSatuan = parseInt(diskonSatuan);
total = (parseInt(total) + parseInt(harga)) - ((parseInt(total) + parseInt(harga)) * (diskonSatuan / 100));
table.rows[index].setAttribute('data-qty', qty); table.rows[index].setAttribute('data-qty', qty);
table.rows[index].setAttribute('data-diskon-satuan', diskonSatuan);
table.rows[index].setAttribute('data-total', total); table.rows[index].setAttribute('data-total', total);
table.rows[index].cells[0].innerHTML = `
<td>
${nama_produk}
<br>
${(diskonSatuan > 0) ? '<small class="text-primary"><s>Rp. ' + harga + '</s></small> | <small class="text-danger">Rp. ' + total + '</small>' : '<small class="text-primary">Rp. ' + total + '</small>'}
<div class="input-group input-group-sm mt-1">
<input type="text" name="keterangan_satuan" class="form-control rounded-0" placeholder="Keterangan..">
</div>
</td>
`;
table.rows[index].cells[1].innerHTML = ` table.rows[index].cells[1].innerHTML = `
<td class="text-center"> <td class="text-center">
<div class="input-group input-group-sm"> <div class="input-group input-group-sm">
<span class="input-group-append"> <span class="input-group-append">
<button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${params})"><b>-</b></button> <button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${params}, '${nama_produk}')"><b>-</b></button>
</span> </span>
<input type="number" name="bayar" class="form-control rounded-0" value="${qty}"> <input type="text" name="bayar" class="form-control rounded-0" readonly value="${qty}">
<span class="input-group-append"> <span class="input-group-append">
<button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${params})">+</button> <button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${params}, '${nama_produk}')">+</button>
</span> </span>
</div> </div>
</td> </td>
@ -642,7 +621,7 @@
} }
// decrement qty menu ordered // decrement qty menu ordered
function decrementMenu(params) { function decrementMenu(params, nama_produk) {
var table = document.getElementById("order-menus"); var table = document.getElementById("order-menus");
var index = 0; var index = 0;
@ -655,25 +634,39 @@
} }
var qty = table.rows[index].getAttribute('data-qty'); var qty = table.rows[index].getAttribute('data-qty');
var diskonSatuan = table.rows[index].getAttribute('data-diskon-satuan');
var total = table.rows[index].getAttribute('data-total'); var total = table.rows[index].getAttribute('data-total');
var harga = table.rows[index].getAttribute('data-harga'); var harga = table.rows[index].getAttribute('data-harga');
if (qty > 1) { if (qty > 1) {
qty = parseInt(qty) - 1; qty = parseInt(qty) - 1;
total = parseInt(total) - parseInt(harga); diskonSatuan = parseInt(diskonSatuan);
total = (parseInt(total) - parseInt(harga)) - ((parseInt(total) - parseInt(harga)) * (diskonSatuan / 100));
table.rows[index].setAttribute('data-qty', qty); table.rows[index].setAttribute('data-qty', qty);
table.rows[index].setAttribute('data-diskon-satuan', diskonSatuan);
table.rows[index].setAttribute('data-total', total); table.rows[index].setAttribute('data-total', total);
table.rows[index].cells[0].innerHTML = `
<td>
${nama_produk}
<br>
${(diskonSatuan > 0) ? '<small class="text-primary"><s>Rp. ' + harga + '</s></small> | <small class="text-danger">Rp. ' + total + '</small>' : '<small class="text-primary">Rp. ' + total + '</small>'}
<div class="input-group input-group-sm mt-1">
<input type="text" name="keterangan_satuan" class="form-control rounded-0" placeholder="Keterangan..">
</div>
</td>
`;
table.rows[index].cells[1].innerHTML = ` table.rows[index].cells[1].innerHTML = `
<td class="text-center"> <td class="text-center">
<div class="input-group input-group-sm"> <div class="input-group input-group-sm">
<span class="input-group-append"> <span class="input-group-append">
<button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${params})"><b>-</b></button> <button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${params}, '${nama_produk}')"><b>-</b></button>
</span> </span>
<input type="number" name="bayar" class="form-control rounded-0" value="${qty}"> <input type="text" name="bayar" class="form-control rounded-0" readonly value="${qty}">
<span class="input-group-append"> <span class="input-group-append">
<button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${params})">+</button> <button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${params}, '${nama_produk}')">+</button>
</span> </span>
</div> </div>
</td> </td>
@ -759,6 +752,7 @@
var id = row.getAttribute('data-id'); var id = row.getAttribute('data-id');
var nama = row.getAttribute('data-nama'); var nama = row.getAttribute('data-nama');
var qty = row.getAttribute('data-qty'); var qty = row.getAttribute('data-qty');
var diskonSatuan = row.getAttribute('data-diskon-satuan');
var harga = row.getAttribute('data-harga'); var harga = row.getAttribute('data-harga');
var total = row.getAttribute('data-total'); var total = row.getAttribute('data-total');
@ -767,6 +761,7 @@
id: id, id: id,
nama: nama, nama: nama,
qty: qty, qty: qty,
diskonSatuan: diskonSatuan,
harga: harga, harga: harga,
total: total total: total
}); });
@ -965,5 +960,5 @@
} }
}) })
} }
</script> </script>
@endpush @endpush