@extends('layouts.master')

@section('title', 'Work order | Alboosh - Timeless authenticity, born of the desert')

@section('title-topbar', __('basic.work order'))

<!-- css insert -->
@section('css')

<!-- select 2 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.1.0-rc.0/css/select2.min.css"
    integrity="sha512-aD9ophpFQ61nFZP6hXYu4Q/b/USW7rpLCQLX6Bi0WJHXNO7Js/fUENpBQf/+P4NtpzNX0jSgR5zVvPOJp+W2Kg=="
    crossorigin="anonymous" referrerpolicy="no-referrer" />

<!-- boostrap datepicker -->
<link rel="stylesheet"
    href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css" />

<!-- tables -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.0.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.11.2/css/dataTables.bootstrap5.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.0.1/css/buttons.bootstrap5.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/autofill/2.3.9/css/autoFill.bootstrap5.min.css">

@endsection



@section('fixedcontent')

<div id="add_buttn_fixed">
    <a data-bs-toggle="modal" data-bs-target="#new_record" class="text-white">
        <i class="fas fa-plus"></i>
    </a>
</div>

<!-- session successful message -->
@if (Session::has('success'))
<div id="flash-msg" class="shadow pt-3">
    <div class="d-flex justify-content-between mb-2">
        <i class="fas fs-1 fa-check"></i>
        <a id="flash-msg-btn" class="text-blue-300 clickable-item-pointer"><i class="fas fa-times"></i></a>
    </div>
    <h3>Sent Successfully</h3>
    <p class="text-blue-300">{{ Session::get('success') }}</p>
</div>
@endif

@endsection

<!-- content insert -->
@section('content')

<div class="container-fluid px-0 px-md-2 mt-3">

    <!-- page title link -->
    <div class="d-flex align-items-center justify-content-between mb-3">
        <span class="mb-0 me-1">
            <a class="link-cust-text text-gray-200 fw-light" href="{{ route('sett.home') }}">{{ __('basic.dashboard') }}
                |</a>
            <a class="link-cust-text text-gray-200 fw-light" href="{{ route('sett.work_order.index') }}">{{
                __('basic.work orders')
                }}
                |</a>
            <a class="text-gray-300"> {{ __('basic.work order') }}</a>
        </span>

        <div class="dropdown">

            <button
                class="d-flex justify-content-center  main-color-bg text-white btn btn-sm shadow-sm b-r-l-cont p-2 px-4 me-1  align-items-center"
                type="button" data-bs-toggle="dropdown" aria-expanded="false"><i class="fas fa-plus fa-sm me-1"></i> {{
                __('basic.new record') }}
            </button>
            <ul class="dropdown-menu">
                <li><a class="dropdown-item"
                        href="{{ route('sett.invoice.create', ['work_order_id=' . $work_order->id]) }}">{{
                        __('basic.new sales invoice') }}</a></li>
                <li><a class="dropdown-item"
                        href="{{ route('sett.purchase_invoice', ['work_order_id=' . $work_order->id]) }}">
                        {{ __('basic.new purchase invoice') }}</a></li>
                <li><a class="dropdown-item"
                        href="{{ route('sett.acc_payment.create', ['type=expenses&work_order_id=' . $work_order->id]) }}">{{
                        __('basic.new expenses') }}</a></li>
                <li><a class="dropdown-item"
                        href="{{ route('sett.acc_payment.create', ['type=income&work_order_id=' . $work_order->id]) }}">{{
                        __('basic.new income') }}</a></li>
            </ul>
        </div>
    </div>

    <div class="card card-input shadow mb-3 pb-3">
        <!-- Card Header - Dropdown -->
        <div class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
            <h6 class="m-0 fw-bold text-gray-500"><i class="fas fa-user me-1"></i> {{ $work_order->name }}</h6>


            @if($work_order->invoice_id)
            <a href="{{ route('sett.invoice.show', $work_order->invoice_id) }}"
                class="btn btn-sm status-col-link status-col-link not_accepted-color-btn b-r-xs mb-1" title="edit"><i
                    class="fas fa-eye"></i> {{ __('basic.invoice') }}</a>
            @endif
        </div>

        <!-- Card Body -->
        <div class="card-body px-4 px-md-5">

            <div class="row px-0 px-md-3 px-lg-5 pt-3">

                <div class="col-4 col-md-3">
                    <div class="row mb-2">
                        <div class="d-flex align-items-center">
                            <i class="fas fa-receipt fs-1 text-gray-500 me-2"></i>
                            <div class="text-truncate">
                                <p class=" mb-0 text-xs text-gray-300">{{ $work_order->start_at }}</p>
                                <a class="mb-1 fw-bold fs-5 text-gray-600 text-truncate">{{ $work_order->name }}</a>
                                <p class="mb-0 text-xs text-gray-400">{{ __('basic.id') }} <strong>
                                        {{ $work_order->new_id }}</strong>
                                </p>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-4 col-md-2 align-self-center">
                    <div class="">
                        <h6 class="text-gray-300 text-xs mb-1">{{ __('basic.worker') }}</h6>
                        <p id="addre_final_info" class="text-gray-600 fs-6 fw-bold mb-0">
                            {{ $work_order->worker->full_name }}
                        </p>
                    </div>
                </div>

                <div class="col-4 col-md-1 align-self-center">
                    <div class="">
                        <h6 class="text-gray-300 text-xs mb-1">{{ __('basic.branch') }}</h6>
                        <p id="addre_final_info" class="text-gray-600 fs-6 fw-bold mb-0">
                            {{ $work_order->branch->name }}
                        </p>
                    </div>
                </div>

                <div class="col-4 col-md-2 align-self-center">
                    <div class="">
                        <h6 class="text-gray-300 text-xs mb-1">{{ __('basic.end date') }}</h6>
                        <p id="addre_final_info" class="text-gray-600 fs-6 fw-bold mb-0">
                            {{ $work_order->end_at }}
                        </p>
                    </div>
                </div>

                <div class="col-4 col-md-1 align-self-center">
                    <div class="">
                        <h6 class="text-gray-300 text-xs mb-1">{{ __('basic.current income') }}</h6>
                        <p class="text-gray-600 fs-6 fw-bold mb-0">
                            {{ $work_order->current_income }} <span class="text-xxs text-gray-200">{{
                                $work_order->currency->code }}</span>
                        </p>
                    </div>
                </div>

                <div class="col-4 col-md-1 align-self-center">
                    <div class="">
                        <h6 class="text-gray-300 text-xs mb-1">{{ __('basic.current expenses') }}</h6>
                        <p class="text-gray-600 fs-6 fw-bold mb-0">
                            {{ $work_order->current_expenses }} <span class="text-xxs text-gray-200">{{
                                $work_order->currency->code }}</span>
                        </p>
                    </div>
                </div>

                <div class="col-6 col-md-2 align-self-center">
                    <div class=" main-color-bg text-center b-r-s-cont p-2">
                        <h6 class="text-blue-300 text-xs mb-1"><i class="fas fa-dollar-sign"></i> {{ __('basic.budget')
                            }}</h6>
                        <p id="addre_final_info" class="text-white fs-4 fw-bold mb-0">
                            {{ $work_order->budget }} <span class="text-xxs text-blue-200">{{
                                $work_order->currency->code }}</span>
                        </p>
                    </div>
                </div>

            </div>

            <div class="row my-2 mt-4 px-0 px-md-5">
                @php
                $expenses_percentage = ($work_order->current_expenses / $work_order->budget) * 100;
                @endphp
                <div class="d-flex justify-content-between">
                    <h6>{{ $work_order->current_expenses }} <span class="text-xxs"> {{ $work_order->currency->code
                            }}</span> ({{ $expenses_percentage }}%)</h6>
                    <h6>{{ $work_order->budget }} <span class="text-xxs"> {{ $work_order->currency->code }}</span></h6>
                </div>
                <div class="progress progress_percentage">
                    <div class="progress-bar" role="progressbar" style="width: {{ $expenses_percentage }}%"
                        aria-valuenow="{{ $expenses_percentage }}" aria-valuemin="0" aria-valuemax="100"></div>
                </div>
            </div>

            <hr>


            <ul class="nav nav-tabs mb-3" id="myTab" role="tablist">
                <li class="nav-item" role="presentation">
                    <button class="nav-link active" id="doctor_records-tab" data-bs-toggle="tab"
                        data-bs-target="#doctor_records" type="button" role="tab" aria-controls="doctor_records"
                        aria-selected="true" class="text-gray-500"><i class="fas fa-file-invoice-dollar me-1"></i>
                        {{ __('basic.invoices') }}</button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="payment-tab" data-bs-toggle="tab" data-bs-target="#payment"
                        type="button" role="tab" aria-controls="payment" aria-selected="true" class="text-gray-500"><i
                            class="fas fa-wallet me-1"></i>
                        {{ __('basic.payments') }}</button>
                </li>
            </ul>

            <div class="tab-content mb-3" id="myTabContent">

                <div class="tab-pane fade show active" id="doctor_records" role="tabpanel"
                    aria-labelledby="doctor_records">

                    <div class="table-responsive">
                        <table class="table display datatable-modal" id="table-debitor" width="100%" cellspacing="0">
                            <thead>

                                <tr>
                                    <th class="text-xxs">{{ __('basic.type') }}</th>
                                    <th class="text-xxs">{{ __('basic.client') }}</th>
                                    <th class="text-xxs">{{ __('basic.date') }}</th>
                                    <th class="text-xxs">{{ __('basic.due date') }}</th>
                                    <th class="text-xxs">{{ __('basic.worker') }}</th>
                                    <th class="text-xxs">{{ __('basic.status') }}</th>
                                    <th class="text-xxs">{{ __('basic.paid amount') }}</th>
                                    <th class="text-xxs">{{ __('basic.total amount') }}</th>
                                    <th class="text-xxs">{{ __('basic.handle') }}</th>

                                </tr>
                            </thead>
                            <tbody>
                                @if($work_order->invoices)

                                @foreach ($work_order->invoices as $item)
                                <tr>

                                    <td>
                                        @if($item->type == 0)
                                        @php
                                        $invoice_type_icon = "fas fa-plus text-green";
                                        $invoice_type_text = __('basic.income');
                                        @endphp
                                        @else
                                        @php
                                        $invoice_type_icon = "fas fa-minus text-red";
                                        $invoice_type_text = __('basic.expenses');
                                        @endphp
                                        @endif
                                        <h6>
                                            <i class="{{ $invoice_type_icon }}"> {{ $invoice_type_text }}</i>
                                        </h6>
                                    </td>
                                    <td>
                                        @if($item->receivable_type === "App\Models\Patient\Patient")
                                        {{ $item->receivable->full_name }}
                                        @else
                                        {{ $item->receivable->company_name }}
                                        @endif
                                    </td>
                                    <td>
                                        {{ $item->inv_date }}
                                    </td>
                                    <td>
                                        @if($item->due_date)
                                        {{ $item->due_date }}
                                        @else
                                        {{ __('basic.no due date') }}
                                        @endif
                                    </td>
                                    <td>
                                        {{ $item->creator->full_name }}
                                    </td>

                                    <td>
                                        @if ($item->status == 0)
                                        @php
                                        $text_color_invoice = 'cancel-color-btn';
                                        $msg_invoice = __('basic.not paid');
                                        @endphp
                                        @elseif ($item->status == 1)
                                        @php
                                        $text_color_invoice = 'pend-color-btn';
                                        $msg_invoice = __('basic.pending');
                                        @endphp
                                        @elseif ($item->status == 2)
                                        @php
                                        $text_color_invoice = 'prog-color-btn';
                                        $msg_invoice = __('basic.installment');
                                        @endphp
                                        @elseif ($item->status == 3)
                                        @php
                                        $text_color_invoice = 'done-color-btn';
                                        $msg_invoice = __('basic.paid');
                                        @endphp
                                        @elseif ($item->status == 4)
                                        @php
                                        $text_color_invoice = 'cancel-color-btn';
                                        $msg_invoice = __('basic.refund');
                                        @endphp
                                        @endif

                                        <span class="badge rounded-pill {{ $text_color_invoice }} badge-padd-l">
                                            {{ $msg_invoice }}</span>
                                    </td>
                                    <td>
                                        {{ $item->total_paid . " " . $item->currency->code }}
                                    </td>
                                    <td>
                                        <h6 class="text-bold text-gray-800">
                                            {{ $item->final_price . " " . $item->currency->code }}
                                        </h6>
                                    </td>
                                    <td class="text-center">
                                        <a href="{{ route('sett.invoice.show', $item->id) }}"
                                            class="btn btn-sm status-col-link status-col-link not_accepted-color-btn b-r-xs mb-1"
                                            title="edit"><i class="fas fa-eye"></i></a>
                                    </td>

                                </tr>
                                @endforeach

                                @endif
                            </tbody>
                        </table>
                    </div>

                </div>

                <div class="tab-pane fade" id="payment" role="tabpanel" aria-labelledby="payment-tab">

                    <div class="row px-0 my-4">

                        <div class="col-12">

                            <div class="table-responsive">
                                <table class="table display datatable-modal" id="table-payments" width="100%"
                                    cellspacing="0">
                                    <thead>

                                        <tr>
                                            <th class="text-xxs">{{ __('basic.name') }}</th>
                                            <th class="text-xxs">{{ __('basic.date') }}</th>
                                            <th class="text-xxs text-center">{{ __('basic.treasury') }}</th>
                                            <th class="text-xxs text-center">{{ __('basic.to') }}</th>
                                            <th class="text-xxs text-center">{{ __('basic.current balance') }}</th>
                                            <th class="text-xxs text-center">{{ __('basic.status') }}</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @if($work_order->payments)

                                        @foreach ($work_order->payments as $item)
                                        <tr>
                                            <td>
                                                <div class="d-flex align-content-center">

                                                    @if ($item->type == 0)
                                                    @php
                                                    $icon = "fas fa-plus";
                                                    $icon_color = "text-green";
                                                    @endphp
                                                    @else
                                                    @php
                                                    $icon = "fas fa-minus";
                                                    $icon_color = "main-color";
                                                    @endphp
                                                    @endif

                                                    <h2 class="me-2">
                                                        <i class="{{ $icon . " " . $icon_color }}"></i>
                                                    </h2>
                                                    <div>
                                                        <h6 class="mb-0 text-s fw-bold">
                                                            {{ $item->code }}
                                                        </h6>
                                                        <h6 class="mb-0">
                                                            {{ $item->receiver }}
                                                        </h6>
                                                    </div>
                                                </div>
                                            </td>

                                            <td>
                                                {{ $item->paid_date}}
                                            </td>

                                            <td>
                                                <a href="{{ route('sett.acc_treasury.show', $item->acc_treasury_id) }}">
                                                    <div
                                                        class="status-col-link not_accepted-color-btn b-r-l-cont p-2 px-4 text-center me-2 clickable-item-pointer">
                                                        {{ $item->treasury->name }}
                                                    </div>
                                                </a>
                                            </td>
                                            <td>
                                                @if($item->type == 0)
                                                <a
                                                    href="{{ route('sett.chart_of_accounts_show', $item->debit_acc_account_id) }}">
                                                    <div
                                                        class="status-col-link not_accepted-color-btn b-r-l-cont p-2 px-4 text-center me-2 clickable-item-pointer">
                                                        {{ $item->debit_acc->name }}
                                                    </div>
                                                </a>
                                                @else
                                                <a
                                                    href="{{ route('sett.chart_of_accounts_show', $item->debit_acc_account_id) }}">
                                                    <div
                                                        class="status-col-link not_accepted-color-btn b-r-l-cont p-2 px-4 text-center me-2 clickable-item-pointer">
                                                        {{ $item->debit_acc->name }}
                                                    </div>
                                                </a>
                                                @endif
                                            </td>

                                            <td>
                                                <h5 class="text-center fw-bold">
                                                    {{ $item->amount .' ' . $item->currency->code}}
                                                </h5>
                                            </td>

                                            <td class="text-center">
                                                <a href="{{ route('sett.acc_payment.show', $item->id) }}"
                                                    class="btn btn-sm status-col-link status-col-link not_accepted-color-btn b-r-xs mb-1"
                                                    title="edit"><i class="fas fa-eye"></i></a>
                                            </td>

                                        </tr>
                                        @endforeach


                                        @endif
                                    </tbody>
                                </table>
                            </div>

                        </div>

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

            <div class="border-gray-300 b-r-l-cont p-4 h-100">
                <label class="form-label text-gray-300"> <i class="fas fa-pen me-1 text-gray-400"></i> {{
                    __('basic.description') }}</label>
                <div class="overflow-auto">
                    {{ $work_order->description }}</div>
            </div>

        </div>


    </div>

</div>

@endsection

<!-- js insert -->
@section('js')
<!-- select 2 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.1.0-rc.0/js/select2.min.js"
    integrity="sha512-4MvcHwcbqXKUHB6Lx3Zb5CEAVoE9u84qN+ZSMM6s7z8IeJriExrV3ND5zRze9mxNlABJ6k864P/Vl8m0Sd3DtQ=="
    crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
    $(document).ready(function() {


            $(".myselect2-record-insert").select2({
                dropdownParent: $("#new_record")
            });

            //hide search
            $('.myselect2-record-insert-nosearch').select2({
                dropdownParent: $("#new_record"),
                minimumResultsForSearch: -1
            });

        })
</script>

<!-- jquery ui datepicker -->
<script type="text/javascript"
    src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
<script>
    $(function() {
            $('.hasdatetimepicker').datepicker({
                todayHighlight: true,
                format: "yyyy-mm-dd",
            });
        });
</script>

<!-- -- datatables plugin -- -->
<script type="text/javascript" src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.11.3/js/dataTables.bootstrap5.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.0.1/js/dataTables.buttons.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.0.1/js/buttons.bootstrap5.min.js"></script>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.0.1/js/buttons.html5.min.js"></script>

<script type="text/javascript" language="javascript"
    src="https://cdn.datatables.net/buttons/2.0.1/js/buttons.print.min.js"></script>

<script type="text/javascript" language="javascript"
    src="https://cdn.datatables.net/buttons/2.0.1/js/buttons.colVis.min.js"></script>


<script>
    $(document).ready(function() {

            var table = $('#table-debitor').DataTable({
                    lengthChange: false,
                    "pageLength": 5,
                    "order": [
                        [0, "ASC"]
                    ],
                    buttons: {
                        dom: {
                            button: {
                                className: 'btn btn-table-export me-0' //Primary class for all buttons
                            }
                        },
                        buttons: ['copy', 'excel', 'pdf', 'print']
                    }
                }

            );

            table.buttons().container()
                .appendTo('#table-debitor_wrapper .col-md-6:eq(0)');

                var table = $('#table-payments').DataTable({
                    lengthChange: false,
                    "pageLength": 5,
                    "order": [
                        [0, "ASC"]
                    ],
                    buttons: {
                        dom: {
                            button: {
                                className: 'btn btn-table-export me-0' //Primary class for all buttons
                            }
                        },
                        buttons: ['copy', 'excel', 'pdf', 'print']
                    }
                }

            );
            table.buttons().container()
                .appendTo('#table-payments_wrapper .col-md-6:eq(0)');

        });
</script>
@endsection