@extends('layouts.app')

@section('title', 'Search Orders')

@section('style')
<link rel="stylesheet" href="{{ asset('admin/plugins/datatables-bs4/css/dataTables.bootstrap4.css') }}">
@endsection

@section('content')
<!-- Content Header (Page header) -->
<section class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-6">
                <h1>Search Orders for <i>"</i> {{ $keyword }} <i>"</i></h1>
            </div>
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="#">Marketing</a></li>
                    <li class="breadcrumb-item active">Search Orders</li>
                </ol>
            </div>
        </div>
    </div><!-- /.container-fluid -->
</section>

<!-- Main content -->
<section class="content">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title"> รายการใบจ่ายงาน (ORDER) ที่ค้นพบ</h3>
                </div>
                <!-- /.card-header -->
                <div class="card-body">
                    <table id="dataTable" class="table table-bordered table-striped table-responsive nowrap"
                        style="width:100%">
                        <thead>
                            <tr>
                                <th class="text-center" scope="col">#</th>
                                <th scope="col">รายงานเลขที่</th>
                                <th scope="col">ผู้ว่าจ้าง/บริษัท</th>
                                <th scope="col">ชื่อลูกค้า</th>
                                <th scope="col">วัตถุประสงค์</th>
                                <th scope="col">ผู้ถือกรรมสิทธิ์</th>
                                <th scope="col">ประเภทงาน</th>
                                <th scope="col">วันที่รับงาน</th>
                                <th scope="col">วันที่ประเมิน</th>
                                <th scope="col">วันที่ส่งงาน</th>
                                <th scope="col">โฉนดเลขที่</th>
                                <th scope="col">เนื้อที่ดิน</th>
                                <th scope="col">พื้นที่ใช้สอย</th>
                                <th scope="col">บ้านเลขที่</th>
                                <th scope="col">หมู่</th>
                                <th scope="col">หมู่บ้าน/โครงการ</th>
                                <th scope="col">จำนวนชั้น</th>
                                <th scope="col">ชั้นที่</th>
                                <th scope="col">ซอย</th>
                                <th scope="col">ถนน</th>
                                <th scope="col">ตำบล</th>
                                <th scope="col">อำเภอ</th>
                                <th scope="col">จังหวัด</th>
                                <th scope="col">วิธีประเมิน</th>
                                <th scope="col">ราคาที่ดิน</th>
                                <th scope="col">อาคาร</th>
                                <th scope="col">ราคาตลาด</th>
                                <th scope="col">ละติจูด</th>
                                <th scope="col">ลองจิจูด</th>
                                <th scope="col">เจ้าหน้าที่</th>
                                <th scope="col">ผู้ตรวจสอบรายงาน</th>
                                <th scope="col">ผู้ประเมินหลัก</th>
                                <th scope="col">&nbsp;</th>
                            </tr>
                        </thead>
                        <tbody></tbody>
                    </table>
                </div>
                <!-- /.card-body -->
            </div>
            <!-- /.card -->
        </div>
        <!-- /.col -->
    </div>
    <!-- /.row -->
</section>
<!-- /.content -->
@endsection

@section('script')
<script src="{{ asset('admin/plugins/datatables/jquery.dataTables.js') }}"></script>
<script src="{{ asset('admin/plugins/datatables-bs4/js/dataTables.bootstrap4.js') }}"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/numeral.js/2.0.6/numeral.min.js"></script>
<script>
var config = {
    url: '/api/orders-data?keyword={{ $keyword }}',
    stop_paging: true,
    columns: [{
            data: 'id',
            name: 'id',
            render: function (data, type, row, meta) {
                return meta.row + meta.settings._iDisplayStart + 1;
            }
        },
        {
            data: 'order_no',
            name: 'order_no'
        },
        {
            data: 'owner_name',
            name: 'owner_name'
        },
        {
            data: 'customer_name',
            name: 'customer_name'
        },
        {
            data: 'objective_text',
            name: 'objective_text'
        },
        {
            data: 'holder_name',
            name: 'holder_name'
        },
        {
            data: 'asset_type_code',
            name: 'asset_type_code'
        },
        {
            data: 'order_date_thai',
            name: 'order_date_thai'
        },
        {
            data: 'estimate_date_thai',
            name: 'estimate_date_thai'
        },
        {
            data: 'delivery_date_thai',
            name: 'delivery_date_thai'
        },
        {
            data: 'deed_no',
            name: 'deed_no'
        },
        {
            data: 'usage_area',
            name: 'usage_area'
        },
        {
            data: null,
            bSortable: false,
            render: function(e) {
                return e.usage_space;
            }
        },
        {
            data: 'house_number',
            name: 'house_number'
        },
        {
            data: 'moo',
            name: 'moo'
        },
        {
            data: 'moo_ban',
            name: 'moo_ban'
        },
        {
            data: 'number_of_floors',
            name: 'number_of_floors'
        },
        {
            data: 'floor',
            name: 'floor'
        },
        {
            data: 'soi',
            name: 'soi'
        },
        {
            data: 'road',
            name: 'road'
        },
        {
            data: 'thumbol_name',
            name: 'thumbol_name'
        },
        {
            data: 'district_name',
            name: 'district_name'
        },
        {
            data: 'province_name',
            name: 'province_name'
        },
        {
            data: 'how_to_estimate',
            name: 'how_to_estimate'
        },
        {
            data: null,
            bSortable: false,
            render: function(e){
                return  e.land_price;
            }
        },
        {
            data: 'building',
            name: 'building'
        },
        {
            data: null,
            bSortable: false,
            render: function(e){
                return e.market_price;
            }
        },
        {
            data: 'latitude',
            name: 'latitude'
        },
        {
            data: 'longitude',
            name: 'longitude'
        },
        {
            data: 'staff_name',
            name: 'staff_name'
        },
        {
            data: 'report_auditor_name',
            name: 'report_auditor_name'
        },
        {
            data: 'primary_assessor_name',
            name: 'primary_assessor_name'
        },
        {
            data: null,
            bSortable: false,
            render: function(e) {
                if (e.status == 0) {
                    return '<a href="/orders/' + e.id +
                        '/edit" class="btn btn-outline-info btn-circle mt-1 btn-outline edit" lang="en" title="Edit"><i class="fas fa-pencil-alt"></i></a>' +
                        ' <a href="/orders/' + e.id +
                        '/delete" onClick="javascript:return confirm(\'Are you sure to delete ?\');" class="btn btn-outline-danger btn-circle mt-1 delete" lang="en" title="Delete"><i class="fas fa-trash"></i></a>';
                }
                return '<a href="/orders/' + e.id +
                    '/detail" class="btn btn-outline-info btn-circle mt-1 btn-outline edit" lang="en" title="Detail"><i class="fas fa-list-alt"></i></a>';
            }
        }
    ]
};
var t = $('#dataTable').DataTable({
        "bProcessing": true,
        "responsive": true,
        "bFilter": false,
        "sAjaxSource": config.url,
        "columns": config.columns,
        "oLanguage": {
           // "sSearch": '<span>Search</span> <i class="fas fa-search"></i>'
        },
        "columnDefs": [{
            "className":"text-center",
            "searchable": false,
            "orderable": false,
            "targets": 0
        }],
        "order": (typeof config.order == "undefined") ? [[ 1, 'desc' ]] : config.order
    });
    t.on('order.dt search.dt', function () {
        t.column(0, {search:'applied', order:'applied'}).nodes().each(function (cell, i) {
            cell.innerHTML = i+1;
        });
    }).draw();
</script>
@stop