<div class="modal fade" id="modal_detail_history" aria-labelledby="exampleModalLabel">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Detail History</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="col-md-12" id="data-pesanan">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group row">
                                <label class="col-md-4 col-form-label">Kode Pesanan</label>
                                <div class="col-md-8">
                                    <input type="text" class="form-control form-control-sm" id="kode_pesanan"
                                        readonly>
                                </div>
                                <label class="col-md-4 col-form-label">Pemesan</label>
                                <div class="col-md-8">
                                    <input type="text" class="form-control form-control-sm" id="nama_pemesan"
                                        readonly>
                                </div>
                                <label class="col-md-4 col-form-label">Tanggal & Jam</label>
                                <div class="col-md-8">
                                    <input type="text" class="form-control form-control-sm" id="tanggal_jam"
                                        readonly>
                                </div>
                                <label class="col-md-4 col-form-label">Nomor Meja</label>
                                <div class="col-md-8">
                                    <input type="text" class="form-control form-control-sm" id="nomor_meja" readonly>
                                </div>
                                <label class="col-md-4 col-form-label">Urutan Pesanan</label>
                                <div class="col-md-8">
                                    <input type="text" class="form-control form-control-sm" id="nomor_antrian"
                                        readonly>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group row">
                                <label class="col-md-4 col-form-label">Total Pesanan</label>
                                <div class="col-md-8">
                                    <input type="text" class="form-control form-control-sm" id="total_pesanan"
                                        readonly>
                                </div>
                                <label class="col-md-4 col-form-label">Sub Total</label>
                                <div class="col-md-8">
                                    <input type="text" class="form-control form-control-sm" id="sub_total" readonly>
                                </div>
                                <label class="col-md-4 col-form-label">Diskon(%)</label>
                                <div class="col-md-8">
                                    <input type="text" class="form-control form-control-sm" id="diskon_persen"
                                        readonly>
                                </div>
                                <label class="col-md-4 col-form-label">Grand Total</label>
                                <div class="col-md-8">
                                    <input type="text" class="form-control form-control-sm" id="grand_total"
                                        readonly>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="table-responsive mt-3">
                    <table id="tabelku" class="table table-hover display" style="width: 100%; font-size: 14px;">
                        <thead>
                            <tr>
                                <th class="text-center">No</th>
                                <th>Nama Produk</th>
                                <th>Harga</th>
                                <th class="text-center">Jumlah Terjual</th>
                                <th>Total Harga</th>
                                <th class="text-center">Diskon(%)</th>
                                <th>Keterangan</th>
                            </tr>
                        </thead>
                        <tbody id="view_history_detail"></tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>