@extends('layouts.layout')
@section('title', 'QC Cashbox')
@section('body_class', 'nav-md')
@section('body_content')

<style>
    .btn-pill {
        border-radius: 5px;
    }
/*break_line*/
    .bl { 
    white-space: pre-wrap;
}
</style>
<div class="container body">
    <div class="main_container">
        @include('includes.sidebar')
        <div class="right_col" role="main">
            <div class="page-title">
                <div class="title_left">
                    <h3><i class="fa fa-edit"></i> Stock @ SK Pusat</h3>
                </div>
                <div class="clearfix"></div>
            </div>
            <div class="row">                
                <div class="col-xs-12">
                    <div class="x_panel">
                        <div class="x_title">
                            Filter (Unload Date)
                        </div>
                        <div class="x_content">
                            <form id="form-search" class="form-horizontal">
                                <div class="col-xs-12 col-sm-12">
                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-3 control-label">Tanggal Mulai :</label>
                                        <div class="col-xs-12 col-sm-5">
                                            <input type="date" class="form-control date_format" name="from_date" id="from_date" placeholder="Tanggal Mulai">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-3 control-label">Tanggal Selesai :</label>
                                        <div class="col-xs-12 col-sm-5">
                                            <input type="date" class="form-control date_format" name="end_date" id="end_date" placeholder="Tanggal Selesai">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-3 control-label">Delivery Order :</label>
                                        <div class="col-xs-12 col-sm-5">
                                            <input type="text" class="form-control" name="do" id="end_date" placeholder="No DO">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-3 control-label">Status Barang :</label>
                                        <div class="col-xs-12 col-sm-5">
                                            <select class="form-control" name="status">
                                                <option value="all">All</option>
                                                <option value="on_delivery" @if($request['status'] == 'on_delivery') selected @endif>Dalam Perjalanan</option>
                                                <option value="received" @if($request['status'] == 'received') selected @endif>Diterima di Pusat</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-3 control-label">Toko :</label>
                                        <div class="col-xs-12 col-sm-5">
                                            <select class="form-control" name="store">
                                                <option value="all">All</option>
                                                @foreach($store_brands as $store_brand)
                                                    @foreach($store_brand->store as $store)
														@php
															$selected_store = '';
															if($request['store']) {
																if($request['store'] != 'all' && $request['store'] == $store->id) {
																	$selected_store = 'selected';
																}
															}
														@endphp
                                                        <option value="{{ $store->id }}") {{ $selected_store }}>{{ $store_brand->name }} {{ $store->name }}</option>
                                                    @endforeach
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group" style="margin-top:20px">
                                        <label class="col-xs-12 col-sm-3 control-label"></label>
                                        <div class="col-xs-12 col-sm-5">
                                            <button type="submit" class="btn btn-primary"><i class="fa fa-search"></i> Search</button>
                                            <button type="button" class="btn btn-warning" id="reset_btn"><i class="fa fa-trash"></i> Reset</button>
                                        </div>
                                    </div>
                                </div>
                            </form>  
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">                
                <div class="col-xs-12">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            Item List
                        </div>
                        <div class="panel-body">
                            <table id="table_cashbox" class="table table-bordered table-striped">
                                <thead>
                                    <tr>
                                        <th>No.</th>
                                        <th>Delivery Order</th>
                                        <th>Terima Dari Toko</th>
                                        <th>Tanggal Kirim</th>
                                        <th>Status</th>
                                        <th width="17%">Actions</th>
                                    </tr>
                                </thead>
                                <tbody class="response" id="scroll">
                                    @foreach($query as $key => $data)
                                        <tr>
                                            <td>{{ $key+1 }}</td>
                                            <td>{{ $data->delivery_code }}</td>
                                            <td>
                                                {{ $data->receive_from_store->name }}
                                                <div><small>{{ $data->receive_from_store->brand->name }}</small></div>
                                            </td>
                                            <td>{{ \Carbon\Carbon::parse($data->unload_date)->format('d M Y H:i') }}</td>
                                            <td>   
                                                @if($data->received_at && $data->received_by)
                                                    Diterima pada :
                                                    <div><small><i class="fa fa-calendar"></i> {{ \Carbon\Carbon::parse($data->received_at)->format('d M Y H:i') }}</small></div>
                                                @else
                                                    <div><small><i class="fa fa-truck"></i> Dalam Perjalanan</small></div>
                                                @endif
                                            </td>
                                            <td>
                                                <a href="{{ url('butik/resell/stock_skpusat/' . $data->id) }}" title="Lihat Detail" class="see_detail btn btn-primary btn-white btn-sm btn-pill"><i class="fa fa-bars"></i></a>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>


                            <div class="text-center">
                                {{ $query->appends($_GET)->links() }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
            <div class="modal fade" id="modal_reason_reject" data-backdrop="false" tabindex="-1" role="dialog">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h4 class="modal-title">Reason Reject</h4>
                        </div>
                        <div class="modal-body">
                            <div class="alert alert-warning alert-dismissible" style="background: #fff9c4; color: #000;" role="alert">
                                <span class="bl" id="reject_content"></span>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-sm waves-effect btn-clus" data-dismiss="modal"><i class="fa fa-close"></i> Close</button>
                        </div>
                    </div>
                </div>
            </div>
        @include('includes.footer')
    </div>
</div>

@endsection
@section('scripts')
@include('includes.helper_js')
<script>

    /**
    $(function() {
        var d = new Date();
        var startDate = d.setMonth(d.getMonth() - 1);
        var e = new Date();
        var endDate = e.setDate(e.getDate());
        Helper.datePicker('date_format',null,endDate);
        $('input[name="from_date"]').val(moment(startDate).format('DD-MM-YYYY'));
        $('input[name="end_date"]').val(moment(endDate).format('DD-MM-YYYY'));
    });

    var tbl = globalCRUD.datatables({
        url: '/butik/qc_cashbox/datatables',
        selector: '#table_cashbox',
        columnsField: [
            'DT_RowIndex',
             { // receive_from_store
                data: 'receive_from_store',
                name: 'receive_from_store',
                render: function(data, type, full) {
                    return data ? data.name : '-';          
                }
            },
            { // unload_date
                data: 'unload_date',
                name: 'unload_date',
                render: function(data, type, full) {
                    return data ? moment(data).format("DD MMMM YYYY HH:mm:ss") : '-';
                }
            },
            { // qc_status
                data: 'qc_status',
                name: 'qc_status',
                render: function(data, type, full) {
                    let label;
                    switch(data) {
                    case 'uncompleted':
                        label = 'danger';
                        break;
                    case 'in_progress':
                        label = 'warning';
                        break;
                    case 'done':
                        label = 'success';
                        break;
                    case 'moved_central':
                        label = 'warning';
                        break;
                    case 'unloaded':
                        label = 'default';
                        break;
                    case 'refinery':
                        label = 'info';
                        break;
                    }
                    return `<label class="label label-pill label-${label}">${data}</label>`
                }
            },
            { // action
                data: "id",
                name: "id",
                render: function(data, type, full) {
                    const lihat_detail = `<button type="button" onclick="window.location.href='${Helper.url('/butik/qc_cashbox/'+data+'/details_list')}'" title='Lihat Detail' data-id='${data}' class='see_detail btn btn-primary btn-white btn-sm btn-pill'><i class="fa fa-bars"></i></button>`;
                    const download_report = `<a href="${Helper.url('/butik/qc_cashbox/'+data+'/report_export')}" data-id='${data}' title='Download Report' type='button' class='delete_store_hub btn btn-default btn-sm btn-pill' style='color:#337ab7;'><i class="fa fa-file-excel-o"></i></a>`;
                    let reason_reject = '';
                    if(full.reason_reject) {
                        reason_reject = `<button type="button" onclick="viewReasonReject('${full.id}','${btoa(full.reason_reject)}')" title='See Reason Reject' data-id='${data}' class='btn btn-warning btn-white btn-sm btn-pill'><i class="fa fa-lightbulb-o"></i></button>`;
                    }  
                    return lihat_detail+' '+download_report+' '+reason_reject;
                }
            }
        ],
        actionLink: ""
    });
    // search datatables;
    $("#form-search").submit(function(e) {
        e.preventDefault();
        let input = Helper.serializeForm($(this));
        playload = '?';
        _.each(input, (val, key) => {
            playload += key + '=' + val + '&'
        });
        playload = playload.substring(0, playload.length - 1);
        console.log(playload);
        url = Helper.url('/butik/qc_cashbox/datatables' + playload);
        tbl.table.reloadTable(url);
    });

    //reset field pencarian
    $("#reset_btn").click(function(e) {
        e.preventDefault();
        $('#from_date').val('');
        $('#end_date').val('');
    });

    function viewReasonReject(id,content) {
        console.log(atob(content));
        $('#reject_content').html(atob(content)).text();
        $('#modal_reason_reject').modal('show');
    }
    **/

</script>
@endsection