@php
	$key = 'all';
@endphp

@extends('layout.default')
@include('layout.filter')

@section('styles')
<!--begin::Page Vendors Styles(used by this page)-->
<link href="{{env('STORAGE_URL_VIEW')}}plugins/custom/datatables/datatables.bundle.css?v=7.0.8" rel="stylesheet" type="text/css" />
<style type="text/css">
	.no_wrap {
		white-space:nowrap;
	}
</style>
<!--end::Page Vendors Styles-->
@endsection

@section('content')
@yield('filter_view')
<div class="card">
	<div class="card-body">
		@include('layout.notifications')
        @if(session('level') != 'Super Admin')
		<div class="text-right">
            <div class="dropdown dropdown-inline">
		        <a href="#" class="btn btn-primary btn-sm font-weight-bolder dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-file-export"></i> Download</a>
		        <div class="dropdown-menu dropdown-menu-sm dropdown-menu-right">
		            <ul class="navi navi-hover">
		                <li class="navi-item">
		                    <a href="{{url('transaction/export')}}" class="navi-link">
		                        <span class="navi-text">Tampilkan List</span>
		                    </a>
		                </li>
		                <li class="navi-item">
		                    <a href="{{url('transaction/export?new=1')}}" class="navi-link">
		                        <span class="navi-text">Buat Baru</span>
		                    </a>
		                </li>
		            </ul>
		        </div>
		    </div>
		</div>
        @endif
        <!--begin: Datatable-->
		<table class="table table-bordered table-checkable" id="kt_datatable">
			<thead>
				<tr>
					<th>Tanggal</th>
					<th>Tipe Transaksi</th>
					<th>Nomor Nota</th>
					<th>Total Harga</th>
					<th>Status Transaksi Terakhir</th>
					<th>Alasan Penolakan</th>
					@if(strtolower($key) == 'delivery')
						<th>Shipment Status</th>
					@endif
					<th>Detail</th>
				</tr>
			</thead>
			<tbody>
			</tbody>
		</table>
	</div>
	<div class="form">

	</div>
</div>
@endsection

@section('scripts')
<!--begin::Page Vendors(used by this page)-->
<script src="{{env('STORAGE_URL_VIEW')}}plugins/custom/datatables/datatables.bundle.js?v=7.0.8"></script>
<!--end::Page Vendors-->

@yield('filter_script')

<script>
	rules={
		all_transaction:{
			display:'Semua Transaksi',
			operator:[],
			opsi:[]
		},
		receipt:{
			display:'Nomor Nota',
			operator:[
				['=','adalah'],
				['like','memiliki']
			],
			opsi:[]
		},
		pickup_by:{
			display:'Tipe Transaksi',
			operator:[],
			opsi:[
				['customer','Pickup'],
				['delivery','Delivery']
			]
		},
		grand_total:{
			display:'Total Penjualan Bersih',
			operator:[
				['=','='],
				['<','<'],
				['>','>'],
				['<=','<='],
				['>=','>=']
			],
			opsi:[],
			type:'number',
			prepend_text:'Rp'
		},
		transaction_status:{
			display:'Status Transaksi Terakhir',
			operator:[
				['=','adalah'],
				['not','bukan']
			],
			opsi:[
				['pending', 'Pesanan Masuk'],
				['receive_at', 'Pesanan Diterima'],
				['ready_at', 'Pesanan Siap Diambil'],
				['taken_by_driver', 'Order Telah Diambil Driver'],
				['taken_by_customer', 'Order Telah Diambil'],
				['taken_by_system', 'Order Selesai'],
				['reject_at', 'Pesanan Ditolak']
			]
		},
		order_id:{
			display:'ID Order',
			operator:[
				['=','adalah'],
				['like','memiliki']
			],
			opsi:[]
		},
		reject_reason:{
			display:'Alasan Penolakan',
			operator:[
				['=','adalah'],
				['like','memiliki'],
				['!=','bukan'],
				['not like','tidak memiliki']
			],
			opsi:[]
		},
	};

	var table;
	$(document).ready(function() {
		// library initialization
		table = $('#kt_datatable').DataTable({
			serverSide: true,
			ajax: {
				url : "{{url('transaction')}}",
				type: 'GET',
				data: function (data) {
					const info = $('#kt_datatable').DataTable().page.info();
					data.page = (info.start / info.length) + 1;
				},
				dataSrc: 'data'
			},
            fnDrawCallback: function( oSettings ) {
                $('#list-filter-result-counter').text(oSettings.jqXHR.responseJSON.recordsTotal);
            },
			columns: [
				{
					data: 'transaction_date',
					/*render: function(date) {
						const datex = new Date(date);
						return datex.toLocaleString('id-ID',{ year: 'numeric', month: 'long', day: 'numeric', hour: '2-digit', minute: '2-digit' });
					}*/
				},
				{data: 'transaction_type'},
				{data: 'receipt_number'},
				{
					data: 'total_price',
					render: function (value) {
						return (value+"").replace('.',',');
					}
				},

				{
					data: 'transaction_status',
					className: "text-center",
					orderable: false
				},
				{
					data: 'reject_reason',
					orderable: false
				},
				@if( strtolower($key) == 'delivery')
					{data: 'shipment_status'},
				@endif
					
				{
					data: 'actions',
					className: "no_wrap",
					orderable: false
				},
			],
			createdRow: function( row, data, dataIndex ) {
			    $(row).data('id', data.product_modifier_id);
			},
			columnDefs: [
			    {
			        'targets': 3,
			        'createdCell':  function (td, cellData, rowData, row, col) {
			           $(td).addClass('input-price');
			        }
			    }
			],
			searching: false,
			responsive: false,
			scrollY: '50vh',
            scrollX: true,
            scrollCollapse: true,
            processing: true,
            order: [[ 0, "desc" ]]
		});

		table.on('draw', function() {
			$('[data-switch=true]').bootstrapSwitch();
			// format price form
	        $('.input-price').inputmask('currency',{
	            removeMaskOnSubmit: true,
	            min:0,
	            prefix: "Rp",
	            autoGroup: true,
	            radixPoint: ",",
	            groupSeparator: ".",
	            rightAlign: false,
	            digits: 0
	        });
		})

		$('#transaction_date_loe').attr('type', 'text');
        $('#transaction_date_loe').datepicker({
            autoclose: true,
            todayHighlight: true,
            format: 'dd/MM/yyyy',
            endDate: new Date('{{date('Y-m-d', strtotime('-1 day'))}}'),
            orientation: "bottom"
        });
		$('#transaction_date_boe').attr('type', 'text');
        $('#transaction_date_boe').datepicker({
            autoclose: true,
            todayHighlight: true,
            format: 'dd/MM/yyyy',
            endDate: new Date('{{date('Y-m-d', strtotime('-1 day'))}}'),
            orientation: "bottom"
        });
	});

</script>

@endsection