@extends('.frontend.default')
@section('content')
    <!---------Service-record-detail-start---------->
    <section class="service-details-main">
        <div class="container">
            <div class="row mb-5">

                <div class="col-md-12" style="margin-bottom: 45px;">
                    <a class="back_button text-size-l" href="{{ route('.teacher.quotationInquiry') }}"><i class="fa fa-angle-left" aria-hidden="true"></i> 返回報價紀錄</a>
                </div>

                <div class="col-md-12">
                    <div class="row justify-content-between align-items-center">
                        <div class="col d-flex flex-column">
                            <p class="title-base">{{ $data->event_title }}</p>
                            <p class="text-size-l">報價工作編號：{{ $data->custom_code }}</p>
                        </div>
                        <div class="col text-right">
                            <label class="status_label background-secondary text-color-base-5 mb-0">
                                {{ __('quotation_inquiry/status.'.$data->status_teacher) }}
                            </label>
                        </div>
                    </div>
                </div>

            </div>

            @if ($data->status == \App\Models\Quotation\QuotationInquiry::STATUS_TEACHER_PENDING && $quotations->where('status', \App\Models\Quotation\Quotation::STATUS_APPROVE)->count() > 0)
                <div class="row">
                    <div class="col-12">
                        <div class="table-head-cont-right">
                            <!-- Button trigger modal -->
                            <div class="border-radius-20 btn border-secondary background-base-color-5 text-secondary float-right mb-2"
                                 data-toggle="modal" data-target="#exampleModal3">
                                <i class="fas fa-arrow-circle-up background-secondary border-secondary border-radius-circle text-color-base-5 mr-2"></i> 按此上傳確認報價文件
                            </div>
                            <!-- Modal -->
                            <div class="modal fade" id="exampleModal3" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel1"
                                 aria-hidden="true">
                                <div class="modal-dialog" role="document" style="width:90%;max-width: 700px">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <h5 class="modal-title" id="exampleModalLabel3"><!-- 上傳確認報價文件 --></h5>
                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="top:10px;right:5px">
                                                <span aria-hidden="true">&times;</span>
                                            </button>
                                        </div>
                                        <div class="modal-body">
                                            <div class="row">
                                                <div class="col-12">
                                                    <div class="files-upls" style="margin-bottom: 20px;">
                                                        <label class="btn fileUpload btn-default" for="upload_confirm_quotation_file">
                                                            <img class="mb-2" src="/images/icon/plus-green.png">
                                                            <p class="display_uploaded_file_name" class="title-base text-primary">上傳確認報價文件</p>
                                                            <p class="text-size-l text-color-base-1">蓋上學校的印章及簽署</p>
                                                            <p class="text-size-l text-color-base-1">JPG/PDF格式並低於5MB</p>
                                                        </label>
                                                    </div>
                                                </div>
                                                <form enctype="multipart/form-data" class="form-group confirm_form flex-column first-confirm w-100">
                                                    <input type="file" id="upload_confirm_quotation_file" name="upload_confirm_quotation_file" hidden>

                                                    <div class="col-12 mb-2">
                                                        <div class="row">
                                                            <label class="col-12 col-md-3">您選擇的服務單位</label>
                                                            <div class="select_box col-12 col-md-9">
                                                                <select class="form-control border-0 select-confirm-quotation selected_quotation_id select-item"
                                                                        name="selected_quotation_id">
                                                                    @foreach ($quotations->where('status', \App\Models\Quotation\Quotation::STATUS_APPROVE) as $quotation)
                                                                        <option value="{{ $quotation->id }}" data-title="{{ $quotation->programme_name }}"
                                                                                data-cost="{{ $quotation->total_cost }}"
                                                                                data-approved_at="{{ Carbon\Carbon::parse($quotation->approved_at)->format('d/m/Y') }}">
                                                                            {{ $quotation->custom_code . ' - ' . $quotation->unit->c_unitname }}
                                                                        </option>
                                                                    @endforeach
                                                                </select>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="col-12 mb-2">
                                                        <div class="row">
                                                            <label class="text-left col-12 col-md-3">服務名稱：</label>
                                                            <div id="selected_quotation_title" class="col-12 col-md-9">

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

                                                    <div class="col-12 mb-2">
                                                        <div class="row">
                                                            <label class="text-left col-12 col-md-3">合計金額：</label>
                                                            <div id="selected_quotation_cost" class="col-12 col-md-9">

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

                                                    <div class="col-12 mb-2">
                                                        <div class="row">
                                                            <label class="text-left col-12 col-md-3">報價發出日期：</label>
                                                            <div id="selected_quotation_approved_at" class="col-12 col-md-9">

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

                                                    <div class="col-12">
                                                        <p class="color-orn text-left">一經選定指定單位報價，其他單位提供的報價單會蓋上取消印章。</p>
                                                        <p class="color-orn text-left">您可在確認前先下載有效報價供學校行政使用。</p>
                                                    </div>
                                                </form>
                                                <div class="col-12">
                                                    <div class="sub-mits">
                                                        <button type="button" class="btn btn-primary btn-submit-confirm modal-hidden px-3 py-2"
                                                                data-popup-id="#exampleModal3" style="height: unset;line-height: normal;">
                                                            確認上傳
                                                        </button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                            <!---Modal-end---->
                        </div>
                    </div>
                </div>
            @endif

            <div class="row">
                <div class="col-12">
                    <div class="tables-mains">
                        <div class="table-head-content">
                            <div class="table-head-cont-le">
                                <h3>報價詳細</h3>
                            </div>
                            <div class="table-head-cont-right">
                                <!-- Button trigger modal -->
                                <a class="text-a-color-base-2" data-toggle="modal" data-target="#exampleModal1">
                                    <span class="mr-2">詳細進度</span><i class="fa fa-arrow-right" aria-hidden="true"></i>
                                </a>

                                <!-- Modal -->
                                <div class="modal fade" id="exampleModal1" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel1"
                                     aria-hidden="true">
                                    <div class="modal-dialog" role="document">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <p class="modal-title" id="exampleModalLabel1">報價情況進度詳細</p><br>
                                                <p>{{ $data->event_title }} {{ $data->custom_code }}</p>
                                                <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="mains-pops">
                                                    <table class="table" style="padding-bottom: 30px">
                                                        <tbody>
                                                        @foreach ($logs as $index => $log)
                                                            <tr>
                                                                <td class="dashed-bdrs border-0">
                                                                    {{ $log['title'] }}
                                                                    @if ($index == count($logs) - 1)
                                                                        <img src="/images/quotation_details/Rectangle-361.png{{'?v=20220325'}}"
                                                                             class="bottom-imgs">
                                                                    @else
                                                                        <img src="/images/quotation_details/Rectangle 419.png{{'?v=20220325'}}">
                                                                    @endif
                                                                </td>
                                                                <td style="text-align:center;width:200px">
                                                                    {{ $log['created_at'] }}
                                                                </td>
                                                                <td class="p-0">
                                                                    {{ $log['message'] }}
                                                                    @if (!empty($log['comment']))
                                                                        <p>{{ $log['comment'] }}</p>
                                                                    @endif
                                                                </td>
                                                            </tr>
                                                        @endforeach
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>


                                        </div>
                                    </div>
                                </div>
                                <!---Modal-end---->
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-12">
                    <table class="table table-quotations">
                        <tbody style="display: inline-table;width: 100%">
                        <tr>
                            <td class="boder-zero">報價單狀態</td>
                            <td class="boder-zero">報價單編號</td>
                            <td class="boder-zero">發出報價單日期</td>
                            <td class="boder-zero">報價單金額</td>
                            <td class="boder-zero">提供服務單位</td>
                            <td class="boder-zero"></td>
                            <td class="boder-zero border-0">下載</td>
                        </tr>
                        @if ($quotations->isEmpty())
                            <tr>
                                <td colspan="7" style="text-align: center;">暫未有報價單</td>
                            </tr>
                        @else

                            @foreach ($quotations as $quotation)
                                <tr>
                                    <td scope="row" class="boder-zero">
                                        {{ __('quotation_inquiry/quotation/status.' . $quotation->status) }}</td>
                                    <td class="boder-zero">{{ $quotation->custom_code }}</td>
                                    <td class="boder-zero">{{ $quotation->created_at->format('Y-m-d') }}</td>
                                    <td class="boder-zero">HK${{ number_format($quotation->total_cost,2) }}</td>
                                    <td class="boder-zero">{{ $quotation->unit->c_unitname }}</td>
                                    @if ($quotation->status == App\Models\Quotation\Quotation::STATUS_CONFIRMED && $quotation->invoices->count() == 0)
                                        <td class="boder-zero"><a href="#" class="tbl-btns px-2 py-2" data-toggle="modal"
                                                                  data-target="#re_upload_quotation_modal_{{ $quotation->id }}">重新上傳報價單</a>
                                        </td>
                                        <!-- Model -->
                                        <div class="modal fade re_upload_quotation_modal" id="re_upload_quotation_modal_{{ $quotation->id }}"
                                             tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel1" aria-hidden="true">
                                            <div class="modal-dialog" role="document" style="width:90%;max-width: 700px">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title" id="exampleModalLabel3">重新上傳報價單</h5>
                                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"
                                                                style="top:0;right:-4px">
                                                            <span aria-hidden="true">&times;</span>
                                                        </button>
                                                    </div>
                                                    <div class="modal-body">
                                                        <div class="files-upls">
                                                            <label class="btn fileUpload btn-default" for="re_upload_confirm_quotation_file_{{ $quotation->id }}">
                                                                <img src="/images/quotation_details/Icon awesome-file-upload-blue.png{{'?v=20220325'}}">
                                                                <p class="display_uploaded_file_name_{{ $quotation->id }}">重新上傳報價單</p>
                                                                <p>- 蓋上學校的印章及簽署</p>
                                                                <p>- JPG/PDF格式並低於5MB</p>
                                                            </label>
                                                        </div>
                                                        <form enctype="multipart/form-data" class="form-group displays confirm_form re-confirm-form">
                                                            <input type="file" id="re_upload_confirm_quotation_file_{{ $quotation->id }}"
                                                                   name="upload_confirm_quotation_file" hidden>
                                                            <div class="re-confirm">
                                                                <div class="row flex-row" style="margin-bottom: 8px;">
                                                                    <label class="col-12 col-md-3">您選擇的服務單位</label>
                                                                    <input type="hidden" name="selected_quotation_id" value="{{ $quotation->id }}">
                                                                    <div class="col-12 col-md-9 select_box">
                                                                        <select class="form-control border-0 select-confirm-quotation selected_quotation_id select-item">

                                                                            <option value="{{ $quotation->id }}"
                                                                                    data-title="{{ $quotation->programme_name }}"
                                                                                    data-cost="{{ $quotation->total_cost }}"
                                                                                    data-approved_at="{{ Carbon\Carbon::parse($quotation->approved_at)->format('d/m/Y') }}" selected>
                                                                                {{ $quotation->custom_code . ' - ' . $quotation->unit->c_unitname }}
                                                                            </option>
                                                                        </select>
                                                                    </div>
                                                                </div>

                                                                <div class="row flex-row" style="margin-bottom: 8px;">
                                                                    <div class="col-12 col-md-3">
                                                                        <label>服務名稱：</label>
                                                                    </div>
                                                                    <div class="col-12 col-md-9" id="selected_quotation_title">

                                                                    </div>
                                                                </div>

                                                                <div class="row flex-row">
                                                                    <div class="col12 col-md-3">
                                                                        <label>合計金額：</label>
                                                                    </div>
                                                                    <div class="col-12 col-md-9">
                                                                        <div id="selected_quotation_cost"></div>

                                                                    </div>
                                                                </div>

                                                                <div class="row flex-row">
                                                                    <div class="col-12 col-md-3">
                                                                        <label>報價發出日期：</label>
                                                                    </div>
                                                                    <div class="col-12 col-md-9">
                                                                        <div id="selected_quotation_approved_at">

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

                                                                <div class="row">
                                                                    <div class="col-12">
                                                                        <p class="color-orn text-left">一經選定指定單位報價，其他單位提供的報價單會蓋上取消印章</p>
                                                                        <p class="color-orn text-left">您可在確認前先下載有效報價供學校行政使用</p>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </form>
                                                        <div class="col-12">
                                                            <div class="sub-mits">
                                                                <button type="button"
                                                                        class="btn btn-primary btn-submit-confirm modal-hidden px-3 py-2 re_upload_quotation_button"
                                                                        data-popup-id="#re_upload_quotation_modal_{{ $quotation->id }}" style="height: unset;line-height: normal;">
                                                                    確認上傳
                                                                </button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                        </div>

                                        <!-- Model-end --->
                                    @else
                                        <td class="boder-zero"></td>
                                @endif
                                <!-- if ($quotation->status == App\Models\Quotation\Quotation::STATUS_CONFIRMED) -->
                                    <td class="boder-zero">
                                        <a class="quotation_download_dropdown" style="cursor: pointer;">
                                            <i class="fa fa-download" aria-hidden="true"></i>
                                        </a>
                                        <div class="down-links">
                                            <ul>
                                                <li>報價單</li>
                                                <li><a target="_black" id="quotation_{{ $quotation->id }}"
                                                       href="{{ route('.teacher.quotation.download_non_signed_pdf', ['quotation_id' => $quotation->getKey()]) }}">未簽名報價單</a>
                                                </li>
                                                @if ($quotation->signed_file_path)
                                                    <li><a target="_black" id="quotation_{{ $quotation->id }}"
                                                           href="{{ route('.teacher.quotation.download_signed', ['quotation_id' => $quotation->getKey()]) }}">
                                                            已簽名報價單
                                                        </a>
                                                    </li>
                                                @endif
                                                @if ($quotation->attachments()->exists())
                                                    <li>附件</li>
                                                    @foreach ($quotation->attachments as $attachment)
                                                        <li>
                                                            <a target="_blank"
                                                               href="{{ route('.teacher.quotation.download_quotation_attachment', ['quotation_attachment_id' => $attachment->getKey()]) }}">
                                                                {{ $attachment->file_name }}
                                                            </a>
                                                        </li>
                                                @endforeach
                                            @endif
                                            <!-- if($quotations->isEmpty()) -->
                                            </ul>
                                        </div>
                                    </td>
                                </tr>
                            @endforeach

                        @endif
                        </tbody>
                    </table>
                </div>
                <div class="col-12 ct-0s-layout">
                    <div class="ct-0s" style="min-width:800px;padding:40px 50px 40px 50px;overflow:hidden">
                        @if($data->eventMethod()->exists() || $data->eventClass()->exists())
                            <div class="row">
                                <div class="col-12">
                                    <div class="ct-hed-main mb-0">
                                        @if($data->eventMethod()->exists())
                                            <div class="cthed-main-one">
                                                <a href="#">
{{--                                                    <img src="/images/quotation_details/material-label.png{{'?v=20220325'}}" alt="">--}}
                                                    {{ $data->eventMethod()->first()->name }}</a>
                                            </div>
                                        @endif
                                        @if($data->eventClass()->exists())
                                            <div class="cthed-main-one">
                                                <a href="#">
{{--                                                    <img src="/images/quotation_details/material-label.png{{'?v=20220325'}}" alt="">--}}
                                                    {{ $data->eventClass()->first()->name }}</a>
                                            </div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        @endif
                        <div class="row" style="position: relative">
                            @if (!empty($data->event_id))
                                <div class="show_school_inquiry_info btn-primary">
                                    <p><</p>
                                    <p>學校報價紀錄</p>
                                </div>
                                <div class="col-11">
                                    <div class="row">
                                        <div class="col-12">
                                            <div class="service_details_content">
                                                <ul class="pt-0">
                                                    <li>
                                                        <span>
                                                            <i class="fas fa-city"></i>
                                                        </span>
                                                        <p>
                                                            舉辦單位：{{empty($data->unit) ? '-' : $data->unit->c_unitname }}
                                                        </p>
                                                    </li>

                                                    <li>
                                                        <span>
                                                            <i class="fas fa-location-arrow"></i>
                                                        </span>
                                                        <p>
                                                            服務地點：{{ empty($data->event_active_address) ? '-' : __('event/active_address.' . $data->event_active_address) }}
                                                        </p>
                                                    </li>

                                                    <li>
                                                        <span>
                                                            <i class="fa fa-user"></i>
                                                        </span>
                                                        <p>
                                                            服務對象：{{ empty($data->eventTarget) ? '-'  : $data->eventTarget->name}}
                                                        </p>
                                                    </li>

                                                    <li>
                                                        <span>
                                                            <i class="far fa-clipboard sub-title-base"></i>
                                                        </span>
                                                        <p>
                                                            服務內容：@nl2br(empty($data->event_content) ? '-'  : $data->event_content)
                                                        </p>
                                                    </li>

                                                    <li>
                                                        <span>
                                                            <i class="fas fa-star sub-title-base"></i>
                                                        </span>
                                                        <p>
                                                            報名須知：@nl2br(empty($data->event_participation_details) ? '-'  : $data->event_participation_details)
                                                        </p>
                                                    </li>

                                                    <li>
                                                        <span>
                                                            <i class="far fa-calendar-alt" style="font-size:20px"></i>
                                                        </span>
                                                        <p>
                                                            截止報名日期：{{ empty($data->event_deadline) ? '-'  : \Carbon\Carbon::parse($data->event_deadline)->format('d/m/Y')}}
                                                        </p>
                                                    </li>

                                                    <li>
                                                        <span>
                                                            <i class="fa fa-dollar-sign sub-title-base"></i>
                                                        </span>
                                                        <p>
                                                            收費：{{$data->event_refer_cost}}
                                                        </p>
                                                    </li>

                                                    @if(!empty($data->event_id))
                                                        <li>
                                                        <span>
                                                            <i class="fa fa-user"></i>
                                                        </span>
                                                            <p>查詢聯絡人資料：
                                                                <br>
                                                                {!! nl2br($data->getContactUsWithMailTo($data->event_contact_us)) !!}
                                                            </p>
                                                        </li>
                                                    @endif

                                                    @if(!empty($data->event_frontend_remark))
                                                        <li>
                                                        <span>
                                                            <i class="fas fa-pencil-alt"></i>
                                                        </span>
                                                            <p>
                                                                備註：@nl2br($data->event_frontend_remark)
                                                            </p>
                                                        </li>
                                                    @endif
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @endif
                                <div class="col-12 col-md-11 {{ empty($data->event_id) ? "" : 'blue_border school_inquiry_info'}}">
                                    <div class="service_details_content">
                                        <h2>學校報價紀錄</h2>
                                        <ul class="p-0">
                                            <li>
                                            <span>
                                                <i class="fas fa-city"></i>
                                            </span>
                                                <p>舉辦單位：{{ empty($data->unit) ? '-' : $data->unit->c_unitname }}</p>
                                            </li>

                                            <li>
                                            <span>
                                                <i class="far fa-calendar-alt" style="font-size:20px"></i>
                                            </span>
                                                <p>服務日期：{{ optional($data->start_date)->format('d/m/Y')}} - {{ optional($data->end_date)->format('d/m/Y')}}</p>
                                            </li>

                                            <li>
                                            <span>
                                                <i class="fas fa-user sub-title-base" ></i>
                                            </span>
                                                <p>參與人數：{{ $data->member_value > 0 ? $data->member_value.'人' : '-'}}</p>
                                            </li>

                                            <li>
                                            <span>
                                                <i class="fas fa-pen sub-title-base" ></i>
                                            </span>
                                                <p>查詢內容：@nl2br(empty($data->quotation_inquiry_content) ? '-' : $data->quotation_inquiry_content)</p>
                                            </li>

                                            <li>
                                            <span>
                                                <i class="fas fa-graduation-cap sub-title-base" ></i>
                                            </span>
                                                <p>負責老師：{{ $data->submitTeacher->fullName }}</p>
                                            </li>


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

                        <div class="row margont-tops">
                            <div class="col-12">
                                <div class="ct-tabs">
                                    <!-- Tabs navs -->
                                    <div>
                                        <ul class="nav nav-tabs">
                                            <li><a data-toggle="tab" href="#home12" class="active">發票下載</a></li>
                                            <li><a data-toggle="tab" href="#menu12">收據下載</a></li>
                                        </ul>
                                        <div class="tab-content pt-0">
                                            <div id="home12" class="tab-pane fade in active show">
                                                <div class="table-drop">
                                                    <div class="main-table-drop">
                                                        <table>
                                                            <thead>
                                                            <tr>
                                                                <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>
                                                            </tr>
                                                            </thead>
                                                            <tbody>
                                                            @forelse($invoices as $invoice)
                                                                <tr>
                                                                    <td scope="row"><i class="fa fa-check-circle" aria-hidden="true"></i>
                                                                        {{ __('invoice/status.' . $invoice->status) }}
                                                                    </td>
                                                                    <td>{{ $invoice->custom_code }}</td>
                                                                    <td>{{ \Carbon\Carbon::parse($invoice->approved_at)->format('d/m/Y H:i') }}
                                                                    </td>
                                                                    <td>HK$ {{ number_format($invoice->amount, 2) }}</td>
                                                                    <td>HK$ {{ number_format($invoice->difference_amount, 2) }}</td>
                                                                    <td>{{ $invoice->unit->c_unitname }}</td>
                                                                    <td><a target="_black"
                                                                           href="{{ route('.teacher.invoice.download_pdf', ['invoice_id' => $invoice->id]) }}"
                                                                           class="invoice_download">
                                                                            <i class="fa fa-download" style="color: #000;" aria-hidden="true"></i>
                                                                        </a>
                                                                    </td>
                                                                </tr>
                                                            @empty
                                                                <tr>
                                                                    <td colspan="7" style="text-align: center;">暫未有發票
                                                                    </td>
                                                                </tr>
                                                            @endforelse
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                            <div id="menu12" class="tab-pane fade">
                                                <div class="table-drop">
                                                    <div class="main-table-drop">
                                                        <table>
                                                            <thead>
                                                            <tr>
                                                                <th scope="col">收據狀態</th>
                                                                <th scope="col">發票編號</th>
                                                                <th scope="col">收據上傳日期</th>
                                                                <th scope="col">收據金額</th>
                                                                <th scope="col">收據提供</th>
                                                                <th scope="col">下載</th>
                                                            </tr>
                                                            </thead>
                                                            <tbody>
                                                            @forelse($receipts as $receipt)
                                                                <tr>
                                                                    <td scope="row"><i class="fa fa-check-circle" aria-hidden="true"></i>
                                                                        {{ __('receipt/status.' . $receipt->status) }}
                                                                    </td>
                                                                    <td>{{ $receipt->invoice->custom_code }}
                                                                    <td>{{ \Carbon\Carbon::parse($receipt->created_at)->format('d/m/Y H:i') }}
                                                                    </td>
                                                                    <td>HK$ {{ number_format($receipt->amount, 2) }}</td>
                                                                    <td>{{ $receipt->invoice->unit->c_unitname }}</td>
                                                                    <td>
                                                                        @if(!empty($receipt->path))
                                                                            <a href="{{ route('.teacher.receipt.download_account_file', ['receipt_id' => $receipt->id]) }}"
                                                                               class="receipt_download">
                                                                                <i class="fa fa-download" style="color: #000;" aria-hidden="true"></i>
                                                                            </a>
                                                                        @else
                                                                            --
                                                                        @endif
                                                                    </td>
                                                                </tr>
                                                            @empty
                                                                <tr>
                                                                    <td colspan="7" style="text-align: center;">暫未有收據
                                                                    </td>
                                                                </tr>
                                                            @endforelse
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                    <!-- Tabs content -->

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

                @if ($data->status == \App\Models\Quotation\QuotationInquiry::STATUS_TEACHER_PENDING)
                    <div class="col-12 mt-5 text-center">
                        <!-- Button trigger modal -->
                        <button type="button" class="btn btn-primary border-radius-10 px-5" data-toggle="modal" data-target="#exampleModal2">
                            取消報價
                        </button>
                        <!-- Modal -->
                        <div class="modal fade" id="exampleModal2" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel1"
                             aria-hidden="true">
                            <div class="modal-dialog" role="document">
                                <div class="modal-content">
                                    <div class="modal-header pb-0">
                                        <h5 class="modal-title" id="exampleModalLabel2">
                                            <img src="{{asset('images/system/smile-none.svg')}}" class="mb-2" style="width: 60px;">
                                            <div>
                                                取消報價
                                            </div>
                                        </h5>
                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="top: 0px;right: 0px;">
                                            <span aria-hidden="true">&times;</span>
                                        </button>
                                    </div>
                                    <div class="modal-body">
                                        <h3 class="text-left">
                                            您是否確認取消報價 <div class="text-primary" style="display: inline-block">報價工作編號：{{$data->custom_code}} </div> 的工作？一經取消不能修改。一經確定取消報價，此報價中的所有報價單及發票單會蓋上取消印章，請取消前先下載所有報價單。
                                        </h3>
                                        <h3></h3><br>
                                        <label for="cancel_cause">
                                            <p class="text-color-base-1">
                                                取消原因
                                            </p>
                                        </label>
                                        <div class="row select_box" style="margin-bottom: .5rem;">
                                            <select class="select-item" id="cancel_cause_selector">
                                                <option>服務費用太昂貴</option>
                                                <option>服務時間不合適</option>
                                                <option>學校對服務內容不感興趣</option>
                                                <option>雙方未能就報價內容得到共識</option>
                                                <option>報價工作重複</option>
                                                <option>其他(請註明原因)</option>
                                            </select>
                                        </div>
                                        <div class="form-group">
                                                    <textarea class="form-control" id="cancel_cause" style="margin-bottom:15px;min-height:100px;"
                                                              hidden></textarea>
                                            <div class="sub-mits text-center">
                                                <a href="#" class="btn btn-primary border-radius-15">
                                                    <p id="cancel_quotation_inquiry_button">確認取消報價</p>
                                                    <p id="cancel_quotation_inquiry_button_loading" hidden>loading... </p>
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!---Modal-end---->
                    </div>
                @endif
            </div>
        </div>
    </section>
    <!---------Service-record-end------------>
    <style>
      .school_inquiry_info {
        opacity: 0;
        position: absolute;
        left: 100vw;
        background-color: white;
        z-index: 11;
        transition: all 0.6s;
      }

      .show_school_inquiry_info {
        width: 53px;
        height: 125px;
        float: right;
        cursor: pointer;
        position: absolute;
        z-index: 12;
        right: -35px;
        top: 60px;
        padding: 10px 10px;
        background-color: #364A8E;
        color: white;
        border-top-left-radius: 15px;
        border-bottom-left-radius: 15px;
        display: flex;
      }

      .show_school_inquiry_info p:first-child {
        line-height: 110px;
        padding-right: 5px;
      }

      .show_school_inquiry_info p:nth-child(2) {
        line-height: 1.1;
      }
    </style>
@endsection
@section('pagescript')
    <script>
        var is_quotation_open_download = false

        $(document).ready(function () {
            let is_show_school_inquiry_info = false;
            $('.ct-0s .show_school_inquiry_info').click(function () {
                if (is_show_school_inquiry_info) {
                    $('.school_inquiry_info').css({'left': '100vw', 'opacity': 0});
                    $('.show_school_inquiry_info p:first-child').text('<');
                } else {
                    $('.school_inquiry_info').css({'left': '0px', 'opacity': 1});
                    $('.show_school_inquiry_info p:first-child').text('>');
                }

                is_show_school_inquiry_info = !is_show_school_inquiry_info;
            });

            setConfirmQuotationDetails($('.first-confirm'));
            setConfirmQuotationDetails($('.re-confirm'));
            $('.first-confirm .selected_quotation_id').change(function () {
                let form = $('.first-confirm');
                setConfirmQuotationDetails(form);
            });

            $('.re-confirm .selected_quotation_id').change(function () {
                let form = $('.re-confirm');
                setConfirmQuotationDetails(form);
            });

            $("#upload_confirm_quotation_file").change(function () {
                $('.display_uploaded_file_name').text($(this)[0].files[0].name);
            });
            @foreach ($quotations as $quotation)
            $("#re_upload_confirm_quotation_file_{{ $quotation->id }}").change(function () {
                $('.display_uploaded_file_name_{{ $quotation->id }}').text($(this)[0].files[0].name);
            });
            @endforeach

            $(".quotation_download_dropdown").click(function () {
                $(this).parents('.boder-zero').find(".down-links").toggleClass("open-download");

                setTimeout(function () {
                    $("body").on("click.quotation_download_dropdown", function () {
                        $(".down-links.open-download").removeClass("open-download");

                        $("body").off('click.quotation_download_dropdown');
                    });
                }, 200);
            });


            $("#cancel_quotation_inquiry_button").click(function () {
                var quotation_inquiry_id = "{{ $data->getKey() }}";

                $('#cancel_quotation_inquiry_button').hide();
                $('#cancel_quotation_inquiry_button_loading').removeAttr('hidden');

                let ajax_data = {
                    type: "post",
                    url: "{{ route('.api.quotation.inquiry.cancelQuotationInquiry', ['quotation_inquiry_id' => $data->getKey()]) }}",
                    data: {
                        'cancel_cause': $('#cancel_cause').val()
                    },
                    success: function (data, status) {
                        location.reload();
                    }
                };

                let success_function = function (data, status) {
                    location.reload();
                };

                let error_function = function (xhr, status, error) {
                    var responseText = JSON.parse(xhr.responseText);
                    if (responseText['errors']) {
                        $.each(responseText['errors'], function (key, error) {
                            new Noty({
                                text: error,
                                type: 'error'
                            }).show();
                        });
                    } else {
                        new Noty({
                            text: error,
                            type: 'error'
                        }).show();
                    }
                }

                callAjax(this, ajax_data, success_function, error_function, false)
            });

            $(".btn-submit-confirm").click(function () {
                let form = new FormData($('.confirm_form.first-confirm')[0]);
                let current_popup = $($(this).data('popup-id'));
                let is_re_upload = 0;
                if ($(this).hasClass('re_upload_quotation_button')) {
                    form = new FormData($('.confirm_form.re-confirm-form')[0]);
                    is_re_upload = 1;
                }

                callAjax(this, {
                    type: "post",
                    url: "{{ route('.api.teacher.quotation_inquiry.confirm', ['quotation_inquiry_id' => $data->getKey()]) }}" + '?selected_quotation_id=' + form.get('selected_quotation_id') + '&is_re_upload=' + is_re_upload,
                    data: form,
                    cache: false,
                    contentType: false,
                    processData: false,
                }, function (data, status) {
                    current_popup.modal('hide');
                    showQuotationUploadSuccessMessage();
                }, function (xhr, status, error) {
                    var responseText = JSON.parse(xhr.responseText);
                    if (responseText['errors']) {
                        $.each(responseText['errors'], function (key, error) {
                            new Noty({
                                text: error,
                                type: 'error'
                            }).show();
                        });
                    } else {
                        new Noty({
                            text: error,
                            type: 'error'
                        }).show();
                    }
                })
            });
        });

        function showQuotationUploadSuccessMessage() {
            $('#exampleModal4').modal('show');
            let message = '';
            message += '<div class="text-center">';
            message += ' <i class="far fa-check-circle text-primary" style="font-size: 90px"></i>';
            message += ' <h3 class="mt-3 text-primary">成功</h3>';
            message += ' <p class="text-size-l mt-3">您已成功上傳已確認的報價單，當發票單已準備好將會透過電郵通知您。 </p>';
            message += ' <p class="text-size-l mt-3">*如您在之後希望取消確認此服務，請聯絡確認報價單上的負責人。</p>';
            message += '</div>';
            bootbox.dialog({
                size: 'large',
                title: '<h2>上傳成功</h2>',
                message: message,
                closeButton: false,
                buttons: {
                    confirm: {
                        label: '確定',
                        className: 'back_button py-2 px-5',
                        callback: function () {
                            location.reload()
                        }
                    },
                }
            });
        }

        function setConfirmQuotationDetails(form) {
            let selector = form.find('.selected_quotation_id');
            let selected_option = selector.find('option[value=\"' + selector.val() + '\"]');

            form.find('#selected_quotation_title').text(selected_option.data('title'));
            form.find('#selected_quotation_cost').text('HK $ ' + selected_option.data('cost'));
            form.find('#selected_quotation_approved_at').text(selected_option.data('approved_at'));
        }

        $('#cancel_cause_selector').change(function () {
            let cancel_cause_textarea = $('#cancel_cause');

            if ($(this).val() == '其他(請註明原因)') {
                cancel_cause_textarea.removeAttr('hidden');
                cancel_cause_textarea.val('');
            } else {
                cancel_cause_textarea.attr('hidden', 'hidden');
                cancel_cause_textarea.val($(this).val());
            }
        });

    </script>
@endsection