@php
    $html = \App\Http\CrudConfig\Quotation\QuotationInquiriesRenderConfig::renderTeacher("resources.views.vendor.backpack.crud.fields.quotation_inquiries.details.blade", $crud, null, function ($crud) {
        $crud->removeField("new_teacher_school_id");
    });
@endphp

<div class="quotation_inquiry_update_page_details ml-3 mr-3 w-100">
    <div class="row">
        <div class="col-12 mb-2">
            <h2 style="color:rgb(235 138 51); display: inline-block">{{$entry->event_title }} {{$entry->custom_code}}</h2>
            <div class="status_box" style="display: inline-block">
                {{ __('backpack::quotation_inquiry.status_system.'.$entry->status) }}
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-12 col-lg-5">
            <div class="mb-3 " style="line-height: 1.1;">學校報價紀錄</div>
            <div class="row">
                <div class="col-12 col-md-3 col-lg-4">
                    <label for="">服務日期:</label>
                </div>
                <div class="col-12 col-md-9 col-lg-8">
                    {{ optional(optional($entry)->start_date)->format('d/m/Y')}} - {{ optional(optional($entry)->end_date)->format('d/m/Y')}}
                </div>
            </div>
            <div class="row">
                <div class="col-12 col-md-3 col-lg-4">
                    <label for="">參與人數:</label>
                </div>
                <div class="col-12 col-md-9 col-lg-8">
                    {{$entry->member_value > 0 ? $entry->member_value : '-'}}
                </div>
            </div>
            <div class="row">
                <div class="col-12 col-md-3 col-lg-4">
                    <label for="">報價學校: </label>
                </div>
                <div class="col-12 col-md-9 col-lg-8">
                    {{$entry->school->name}}
                </div>
            </div>
        </div>
        <div class="col-12 col-lg-6">
            <div class="mb-3 ">
                聯絡資料
                @if(backpack_user()->can("update", $entry))
                    <span class="btn btn-xs btn-normal-comfirm"
                          onclick="quotationInquiryChangeContentTeacher(this)"
                          data-route="{{ url($crud->route.'/'.$entry->getKey().'/change_contact_teacher') }}"
                          data-button-type="edit"
                          data-quotation-inquiry-id="{{ $entry->getKey() }}">
                        <i class="la la-pencil" style="margin-left: 0;"></i>
                        更改負責老師
                    </span>

                @endif
            </div>
            <div class="row">
                <div class="col-12 col-md-3">
                    <label for="">負責老師: </label>
                </div>
                <div class="col-12 col-md-9">
                    {{$entry->contactTeacher->fullName}}
                </div>
            </div>
            <div class="row">
                <div class="col-12 col-md-3">
                    <label for="">學校: </label>
                </div>
                <div class="col-12 col-md-9">
                    {{$entry->contactTeacher->school->name}}
                </div>
            </div>
            <div class="row">
                <div class="col-12 col-md-3">
                    <label for="">電郵: </label>
                </div>
                <div class="col-12 col-md-9">
                    {{$entry->contactTeacher->email ?? '-'}}
                </div>
            </div>
            <div class="row">
                <div class="col-12 col-md-3">
                    <label for="">{{(!empty($entry->contactTeacher->phone) ? '聯絡電話:' : '學校電話:' )}} </label>
                </div>
                <div class="col-12 col-md-9">
                    {{($entry->contactTeacher->phone ?? $entry->school->telephone) ?? '-'}}
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-12">
            <label for="">單位狀態:</label>
        </div>
        @foreach($entry->quotationInquiryUnit as $quotationInquiryUnit)
            <div class="col-12 col-lg-5 col-xl-3 mb-3">
                <div>{{ $quotationInquiryUnit->unit->crudDisplay }}</div>
                <div class="status_box" style="display: inline-block">

                    {{ __('backpack::quotation_inquiry.status_staff.'.$quotationInquiryUnit->status) }}
                </div>
            </div>
        @endforeach
    </div>
</div>

<style>
  .status_box {
    padding: 5px 10px;
    display: inline-block;
    border-radius: 10px;
    min-width: 115px;
    text-align: center;
    background: #FFF
  }
</style>

@push('body-top')
    <div id="QuotationInquiryChangeTeacher" class="modal fade" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">更換聯絡老師</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="card" style="background: none; box-shadow: none;">
                        <div class="row">
                            <form class="QuotationInquiryChangeTeacherForm" style="width: 100%;">
                                <div class="form-group col-sm-12">
                                    <div class="field_display">
                                        <label>學校</label>
                                        <span class="new_school_name"></span>
                                    </div>
                                </div>
                                {!! $html !!}
                                <input type="hidden" name="query_school_id" class="query_school_id">
                                <input type="hidden" name="quotation_inquiry_id" class="quotation_inquiry_id">
                            </form>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default btn-normal-cancel" data-dismiss="modal">
                        {{ trans("backpack::common/button.cancel.name") }}
                    </button>
                    <button type="button" class="btn btn-normal-create" onclick="QuotationInquiriesChangeContentTeacherSubmitConfirm(this)">
                        {{ trans("backpack::common/button.submit.name") }}
                    </button>
                </div>
            </div>
        </div>
    </div>
@endpush

@push("after_scripts")
    <script>
        var quotation_inquiry_change_teacher_is_loading = false
        var quotation_inquiry_list_change_teacher_selector;

        function quotationInquiryChangeContentTeacher(_button) {
            // ask for confirmation before deleting an item
            // e.preventDefault();
            let button = $(_button);
            let route = button.attr('data-route');
            let model_pop = $('#QuotationInquiryChangeTeacher');
            model_pop.attr("data-quotation-inquiry-route", route);
            model_pop.on('shown.bs.modal', function (e) {
                quotationInquiryChangeContentTeacherInit(model_pop, button.attr('data-quotation-inquiry-id'));
            })
            model_pop.modal('show');
            setTimeout(function () {
                model_pop.removeAttr("tabindex");
            }, 500)
        }

        function quotationInquiryChangeContentTeacherInit(container, quotation_inquiry_id) {
            if (container instanceof jQuery) {
                quotation_inquiry_list_change_teacher_selector = container;
            } else {
                quotation_inquiry_list_change_teacher_selector = $(container);
            }
            quotation_inquiry_list_change_teacher_selector.find("[data-init-function-after]").not("[data-initialized=true]").each(function () {
                var element = $(this);
                var functionName = element.data('init-function-after');

                if (typeof window[functionName] === "function") {
                    window[functionName](element);

                    // mark the element as initialized, so that its function is never called again
                    element.attr('data-initialized', 'true');
                }
            });

            quotation_inquiry_list_change_teacher_selector.find('.quotation_inquiry_id').val(quotation_inquiry_id);
            quotation_inquiry_list_change_teacher_selector.find('.query_school_id').val('{{ $entry->school->getKey() }}');
            quotation_inquiry_list_change_teacher_selector.find('.new_school_name').html('{{ $entry->school->name }}');
        }

        function QuotationInquiriesChangeContentTeacherSubmitConfirm(button) {
            $('#QuotationInquiryChangeTeacher').modal('hide');
            var message = '';
            message += '<p>請小心確認老師的資料，更新負責老師後，此報價工作的所有重要通知亦會發送到老師的電郵地址。</p>';


            if (quotation_inquiry_list_change_teacher_selector.find("select[name=teacher_id]").val() == -1){
                message += '<p>';
                message += '    姓名：' + quotation_inquiry_list_change_teacher_selector.find("input[name=new_teacher_surname]").val() + quotation_inquiry_list_change_teacher_selector.find("input[name=new_teacher_given_name]").val();
                message += '    <br/>';
                message += '    電郵地址：' + quotation_inquiry_list_change_teacher_selector.find("input[name=new_teacher_email]").val();
                message += '</p>';
            }
            message += '<p>*在此報價工作重新建立報價/發票單時，您需要自行更新「上款」的最新負責老師姓名。</p>';

            bootbox.confirm({
                message: message,
                buttons: {
                    cancel: {
                        label: '修改',
                        className: 'btn btn-default btn-normal-cancel'
                    },
                    confirm: {
                        label: '確認更新負責老師',
                        className: 'btn btn-normal-create'
                    },
                },
                callback: function (result) {
                    if (result) {
                        QuotationInquiriesChangeContentTeacherSubmit(button);
                    }
                }
            });
        }

        function QuotationInquiriesChangeContentTeacherSubmit(button) {

            if (quotation_inquiry_change_teacher_is_loading) {
                return;
            }
            quotation_inquiry_change_teacher_is_loading = true;

            var self_button = $(button);
            self_button.append('<i class="las la-spinner la-spin" style="color: #FFF; display: inline-block; margin-left: 5px;"></i>');
            $.ajax({
                url: quotation_inquiry_list_change_teacher_selector.attr("data-quotation-inquiry-route"),
                type: 'POST',
                data: quotation_inquiry_list_change_teacher_selector.find(".QuotationInquiryChangeTeacherForm").serialize(),
                success: function(result) {
                    location.reload();
                    bootbox.hideAll();
                },
                error: function(result) {
                    bootbox.hideAll();
                    self_button.find(".las").remove();
                    quotation_inquiry_change_teacher_is_loading = false;

                    // Show an alert with the result
                    new Noty({
                        type: "warning",
                        text: "無法更換老師，請稍後再試。"
                    }).show();

                    $.each(JSON.parse(result.responseText)['errors'], function (key, error) {
                        new Noty({
                            text: error,
                            type: 'error'
                        }).show();
                    });
                }
            });
        }
    </script>
@endpush