@extends('layouts.base')

@section('content-header')
    <div class="col-12">
        <div class="container" style="display: contents">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0"> Penjualan</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item">Home</li>
                        <li class="breadcrumb-item">Transaksi</li>
                        <li class="breadcrumb-item active">Penjualan</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('content')
    <div class="col-12 mt-2">
        <div class="container" style="display: contents">
            <div class="card">
                <div class="card bg-warning" style="min-height:5px; border-radius:1px;"></div>
                <div class="card-body">
                    @if (Session::has('errors'))
                        <div class="alert alert-danger alert-dismissible">
                            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                            <h5><i class="icon fas fa-ban"></i> Gagal</h5>
                            {{ Session::get('errors') }}
                        </div>
                    @endif
                    <div class="row">
                        <div class="col-md-10">
                            <label>Filter Pencarian:</label>
                            <form action="{{ route('penjualan.laporan') }}" method="POST">
                                @csrf
                                <div class="row" style="align-items: center;">
                                    <div class="col-md-3">
                                        <input type="date" class="form-control" id="filter_tanggal_1"
                                            name="filter_tanggal_1" value="{{ date('Y-m-d') }}">
                                    </div>
                                    <span>s/d</span>
                                    <div class="col-md-3">
                                        <input type="date" class="form-control" id="filter_tanggal_2"
                                            name="filter_tanggal_2" value="{{ date('Y-m-d') }}">
                                    </div>
                                    <div class="col-md-3">
                                        <select type="text" class="form-control select2" id="jenis_coa"
                                            style="width: 100%;" name="jenis_coa">
                                            <option selected value="">--Pilih Rekening--</option>
                                            @foreach ($aba as $coaAba)
                                                @if ($coaAba->status == 0)
                                                    <optgroup label="{{ $coaAba->coa }} | {{ $coaAba->keterangan_coa }}">
                                                    @else
                                                        <option value="{{ $coaAba->id }}">
                                                            {{ $coaAba->coa }} | {{ $coaAba->keterangan_coa }}</option>
                                                @endif
                                            @endforeach
                                            </optgroup>
                                            <option value=""><b>Tampilkan Semua data</b></option>
                                        </select>
                                    </div>
                                    <div class="col-md-4">
                                        <a href="javascript:void(0)" class="btn btn-sm btn-primary" id="btn_filter"><i
                                                class="fas fa-search mr-1"></i>Filter data</a>
                                        <button class="btn btn-sm btn-warning" id="cetak_laporan" type="submit"><i
                                                class="fas fa-print mr-1"></i>Cetak Laporan Penjualan</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="col-md-2" style="text-align: right">
                            {{-- <a class="btn btn-sm btn-info mt-4" id="penjualan_cancel"
                                href="{{ route('penjualan.dibatalkan') }}"><i class="fas fa-table mr-1"></i>Penjualan
                                Dibatalkan</a> --}}
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="table-responsive mt-3">
                            <table id="tabelku" class="table table-hover display" style="width: 100%">
                                <thead>
                                    <tr>
                                        <th class="text-center">No</th>
                                        <th>Kode Pesanan</th>
                                        <th>Pemesan</th>
                                        <th>Status Pembayaran</th>
                                        <th>Tanggal & Jam</th>
                                        <th>Total Pesanan</th>
                                        <th>Sub Total</th>
                                        <th>Diskon(%)</th>
                                        <th>Grand Total</th>
                                        <th class="text-center"><i class="fas fa-cog"></i></th>
                                    </tr>
                                </thead>
                                <tfoot>
                                    <tr>
                                        <th class="text-right" colspan="5">Total</th>
                                        <th></th>
                                        <th class="text-right"></th>
                                        <th></th>
                                        <th class="text-right"></th>
                                        <th class="text-center"><i class="fas fa-cog"></i></th>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @include('pages.admin.penjualan.modal')
@endsection

@include('pages.admin.penjualan.style')
@include('pages.admin.penjualan.js')