@extends('layouts.app')
@section('title')
Delivery Detail
@endsection
@push('styles')
<link href="../assets/plugins/datatables.net-bs5/css/dataTables.bootstrap5.min.css" rel="stylesheet" />
<link href="../assets/plugins/datatables.net-responsive-bs5/css/responsive.bootstrap5.min.css" rel="stylesheet" />
<link href="../assets/custom.css">
@endpush

@section('content')
<!-- BEGIN page-header -->
<h1 class="page-header">Delivery Detail</h1>
<!-- END page-header -->

<div class="row">
    <div class="row col-md-9">
        <!-- BEGIN panel -->
    <div class="panel panel-inverse">
        <div class="panel-body">
            <div class="row">
                <div class="col-lg-6">

                    <div class="row mb-0">
                        <div class="col-sm-4 text-sm-right"><dt>Name:</dt> </div>
                        <div class="col-sm-8 text-sm-left"><div class="mb-1">{{$materialdelivery->name}}</div> </div>
                    </div>
                    <div class="row mb-0">
                            <div class="col-sm-4 text-sm-right">
                                <dt>Delivery Date:</dt>
                            </div>
                            <div class="col-sm-8 text-sm-left">
                                <div class="mb-1">{{$materialdelivery->delivery_date}}</div>
                            </div>
                    </div>
                    <div class="row mb-0">
                            <div class="col-sm-4 text-sm-right">
                                <dt>Delivery Quantity:</dt>
                            </div>
                            <div class="col-sm-8 text-sm-left">
                                <div class="mb-1"> @convert($materialdelivery->total_send_amount)</div>
                            </div>
                    </div>
                    <div class="row mb-0">
                            <div class="col-sm-4 text-sm-right">
                                <dt>Delivery By:</dt>
                            </div>
                            <div class="col-sm-8 text-sm-left">
                                <div class="mb-1"> {{$materialdelivery->deliveryusername}}</div>
                            </div>
                    </div>
                    <div class="row mb-0">
                            <div class="col-sm-4 text-sm-right">
                                <dt>Delivery Note:</dt>
                            </div>
                            <div class="col-sm-8 text-sm-left">
                                <div class="mb-1"> <textarea cols="40" rows="3" style="border:0px;resize:none;" readonly>{{$materialdelivery->delivery_note}}</textarea></div>
                            </div>
                    </div>
                </div>
                <div class="col-lg-6" >
                        <div class="row mb-0">
                                <div class="col-sm-4 text-sm-right"><dt>Status:</dt> </div>
                                <div class="col-sm-8 text-sm-left">
                                        <div class="mb-1">
                                            @if ($materialdelivery->status == 1)
                                            <span class="badge bg-warning">{{trans('custom.stock.delivery.'.$materialdelivery->status.'')}} </span>
                                            @elseif($materialdelivery->status == 2)
                                            <span class="badge bg-primary">{{trans('custom.stock.delivery.'.$materialdelivery->status.'')}} </span>
                                            @elseif($materialdelivery->status == 3)
                                            <span class="badge bg-danger">{{trans('custom.stock.delivery.'.$materialdelivery->status.'')}} </span>
                                            @elseif($materialdelivery->status == 4)
                                            <span class="badge bg-success">{{trans('custom.stock.delivery.'.$materialdelivery->status.'')}} </span>
                                            @endif
                                        </div>
                                </div>
                        </div>
                    <div class="row mb-0">
                        <div class="col-sm-4 text-sm-right">
                            <dt>Receive Date:</dt>
                        </div>
                        <div class="col-sm-8 text-sm-left">
                            <div class="mb-1">
                               {{$materialdelivery->receive_date}}
                            </div>
                        </div>
                    </div>
                    <div class="row mb-0">
                            <div class="col-sm-4 text-sm-right">
                                <dt>Receive Quantity:</dt>
                            </div>
                            <div class="col-sm-8 text-sm-left">
                                <div class="mb-1">
                                   {{$materialdelivery->total_receive_amount}}
                                </div>
                            </div>
                    </div>
                    <div class="row mb-0">
                            <div class="col-sm-4 text-sm-right">
                                <dt>Receive By:</dt>
                            </div>
                            <div class="col-sm-8 text-sm-left">
                                <div class="mb-1"> {{$materialdelivery->receiveusername}}</div>
                            </div>
                    </div>
                    <div class="row mb-0">
                            <div class="col-sm-4 text-sm-right">
                                <dt>Receive Note:</dt>
                            </div>
                            <div class="col-sm-8 text-sm-left">
                                <div class="mb-1">
                                    <textarea cols="40" rows="3" style="border:0px;resize:none;" readonly>{{$materialdelivery->receive_note}}</textarea>

                                </div>
                            </div>
                    </div>
                </div>
            </div>


            <div class="table-responsive">
                <table id="delivery_detail_table" class="table table-striped table-bordered align-midivive nowrap w-100">
                    <thead>
                        <tr>
                            <th>Material Code</th>
                            <th>Material Name</th>
                            <th>Material Delivery</th>
                            <th>Material Receive</th>
                        </tr>
                    </thead>
                    <tbody>

                    </tbody>
                    <tfoot>
                        <tr>
                            <th>Material Code</th>
                            <th>Material Name</th>
                            <th>Material Delivery</th>
                            <th>Material Receive</th>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>
    </div>
    <!-- END panel -->
    </div>

    <div class="col-md-3">

        <h5>Files</h5>
        <ul>
            @foreach ($file as $item)
                @if ($item->filetype == 'image/png' | $item->filetype == 'image/jpg' | $item->filetype == 'image/jpeg')
                <li><a href="{{asset('storage/stockfile/'.$item->file_url)}}" target="_blank" download><i class="fa fa-file-picture-o"></i> {{$item->file_url}}</a></li>
                @else
                <li><a href="{{asset('storage/stockfile/'.$item->file_url)}}"  target="_blank"download><i class="fa fa-file"></i> {{$item->file_url}}</a></li>
                @endif
            @endforeach

        </ul>



        <form method="post" action="{{route('uploadfile')}}" enctype="multipart/form-data">
            @csrf
            <input type="hidden" name="id" value="{{$materialdelivery->id}}">
            <div class="text-center m-t-md">
                <input id="logo" type="file" class="form-control" name="file" id="file">
                <button type="submit" class="btn btn-xs btn-primary">Add files</button>
            </div>
        </form>

    </div>
</div>

@include('modals.materialadd')
@include('modals.materialedit')
@endsection

@push('scripts')
<script src="../assets/plugins/datatables.net/js/jquery.dataTables.min.js"></script>
<script src="../assets/plugins/datatables.net-bs5/js/dataTables.bootstrap5.min.js"></script>
<script src="../assets/plugins/datatables.net-responsive/js/dataTables.responsive.min.js"></script>
<script src="../assets/plugins/datatables.net-responsive-bs5/js/responsive.bootstrap5.min.js"></script>

<script>

$('#delivery_detail_table').DataTable({
        pageLength: 10,
        lengthMenu: [5, 10, 20, 50],
        order: [[ 1, "desc" ]],
        search: {
            return: true,
        },
        columns: [
            {data:'material_code',name:'material.material_code',searchable: true,orderable:true},
            {data:'material_name',name:'material.material_name',searchable: true,orderable:true},
            {data:'material_send_amount',name:'material_transection_detail.material_send_amount',searchable: true,orderable:true},
            {data:'material_receive_amount',name:'material_transection_detail.material_receive_amount',searchable: true,orderable:true},

        ],
        processing: true,
        serverSide: true,
        ajax: {
            url: "{{route('deliverydetaildatatable')}}",
            type: 'post',
            data: function (d) {
                d.delivery_id = "{!! $materialdelivery->id !!}";
            },
        },

});


</script>
@endpush