@php
    // Current exchange rate
    $exchangeRate = ExchangeRate::get('sell', $school->currency);
    $exchangeRate = $exchangeRate['days-0'];
@endphp

@section('css')
<link rel="stylesheet" href="/assets/css/estimate.css?v=1.1"/>
@endsection

@section('js')
<script src="/assets/js/estimate.js?v=1"></script>
<script type="text/javascript">
    $(function() {
        // 항목 편집
        $('.estimate-price-table button.edit').click(function() {
            $(this).closest('.estimate-price-table').editable(true);
        });
        // 항목 완료
        $('.estimate-price-table button.complete').click(function() {
            $(this).closest('.estimate-price-table').editable(false);
        });
        // ed:m 장학혜택 추가
        $('.estimate-price-table.benefit button.add').click(function() {
            var $el = $(this).closest('.estimate-price-table');
            $el.editable(true);
            $el.calculator().add();
        });
        // ed:m 장학혜택 활성화
        $('.estimate-price-table.benefit button.enable').click(function() {
            $(this).closest('.estimate-price-table').removeClass('disable');
        });
        // ed:m 장학혜택 비활성화
        $('.estimate-price-table.benefit button.disable').click(function() {
            $(this).closest('.estimate-price-table').addClass('disable');
        });

        calcTotal();
    });
</script>
@endsection

@inject('FrontendPresenter', 'App\Presenters\FrontendPresenter')
@section('json-ld', Breadcrumbs::view('breadcrumbs::json-ld', 'search_language-school-caculator', $school->school_id, $school->name))
@extends('layouts.frontend')
@section('content')
<main class="main pt-0">
    <div class="container py-8 px-0 px-md-3">
        <div class="row align-items-center">
            <div class="col-12 col-md-5">
                <div class="slider-school-gallery slider-school-gallery-lg">
                    @if (isset($school->schoolImage))
                        @foreach ($school->schoolImage as $num => $i)
                            @if ($num == 10)
                                @break
                            @endif
                            <img class="img-fluid" src="{{$i->url}}">
                        @endforeach
                    @endif
                </div>
            </div>
            <div class="col-12 col-md-6 mt-6 mt-md-0 px-6 px-md-0">
                <div class="row align-items-center justify-content-between">
                    <div class="col">
                        <img class="img-fluid" src="{{$school->logo}}" style="max-width: 140px;">
                    </div>
                    @if (env('hide') == 'N')
                    <div class="col text-right" id="btnlike">
                        @include('frontend.module.school-btnlike')
                    </div>
                    @endif
                </div>
                <div class="h3 font-weight-bold my-4">{{$school->name}}</div>
                <div class="text-muted mb-3">
                    <i class="fas fa-sm fa-map-marker-alt"></i> {{ $FrontendPresenter->getCountry($school->country) }} {{$school->city_tw}}
                </div>
                <p class="text-row-3">
                    {!!$school->feature!!}
                </p>
            </div>
        </div>
    </div>

    <div class="nav-secondary nav-sticky border-0">
        <div class="container">
            <div class="nav-light">
                <ul class="nav nav-big">
                    <li class="nav-item">
                        <a class="nav-link" href="{{ route('search_school-content', request()->segment(3)) }}">學校</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ route('search_school-course', request()->segment(3)) }}">課程</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link active" href="{{ route('search_language-school-caculator', request()->segment(3)) }}">即時報價</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <div class="container breadcrumbs">
        {{ Breadcrumbs::render('search_language-school-caculator', $school->school_id, $school->name) }}
    </div>

    <div class="container pt-8 pt-md-12">
        <div class="row justify-content-center">
            <div class="col-12 col-md-8">
                <form class="estimate-form">
                    <input type="hidden" id="exchange_rate" value="{{ $exchangeRate }}"/>
                    <input type="hidden" id="currency_symbol" value="{{ getCurrencySymbol($school->currency) }}"/>
                </form>

                <div class="estimate-wrap" id="estimateWrap">
                    <div class="estimate-hgroup">
                        <div class="estimate-headed">
                            報價單
                            <span class="edm-logo"><img src="/assets/img/em_header_artuhak_tw.png" /></span>
                        </div>
                    </div>
                    @if (isOffice())
                        <div class="estimate-info-table">
                            <table>
                                <colgroup>
                                    <col width="*"/>
                                    <col width="33.33%"/>
                                    <col width="33.33%"/>
                                </colgroup>
                                <thead>
                                <tr>
                                    <th>學生姓名</th>
                                    <th>顧問資訊</th>
                                    <th>學費適用年度</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr>
                                    <td>
                                        <div class="inp-box school-name">
                                            <div class="d-flex flex-row">
                                                <label>註冊學校</label>
                                                <div class="name">{{ $school->name }}</div>
                                            </div>
                                        </div>
                                        <div class="inp-box user-name">
                                            <div class="d-flex flex-row">
                                                <label>學生姓名</label>
                                                <div><input type="text" placeholder="學生姓名"/></div>
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="inp-box">
                                            <div class="d-flex flex-row">
                                                <label>諮詢顧問</label>
                                                <div><input type="text" placeholder="諮詢顧問"/></div>
                                            </div>
                                        </div>
                                        <div class="inp-box">
                                            <div class="d-flex flex-row">
                                                <label>日期</label>
                                                <div><input type="text" placeholder="日期" value="{{ ExchangeRate::time()->format('Y.m.d') }}"/></div>
                                            </div>
                                        </div>
                                        <div class="inp-box">
                                            <div class="d-flex flex-row">
                                                <label>電話</label>
                                                <div><input type="text" placeholder="電話號碼"/></div>
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="select-year">
                                            @foreach ($year_list->reverse() as $y)
                                                <a href="{{ route('search_language-school-caculator', [$school->school_id, 'year' => $y]) }}" class="{{ $y == $year ? 'active' : '' }}">{{ $y }}年</a>
                                            @endforeach
                                        </div>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    @else
                        <div class="estimate-info-table">
                            <div class="notice-wrap">
                                <ul>
                                    <li>自助報價尚未加入學校優惠及edm優惠,</li>
                                    <li>詳細優惠內容歡迎向負責顧問詢問</li>
                                </ul>
                                <div class="button-wrap">
                                    <button class="counsel color" onclick="window.open('{{ route('channel_appointment') }}')">預約諮詢</button>
                                </div>
                            </div>
                        </div>
                        <div class="estimate-howto">
                            <div class="clearfix title">
                                <strong>使用說明</strong>
                                <div class="right-wrap">
                                    <label for="howtoOpen" class="howto-open">展開</label>
                                </div>
                            </div>
                            <input type="checkbox" id="howtoOpen" hidden="hidden"/>
                            <div class="column">
                                <div class="col5">
                                    <p class="img"><img src="/assets/img/howto_img01.png" alt=""></p>
                                    <p class="txt">
                                        <span class="num">Step1</span>
                                        選擇想就讀的課程、
                                        週數，確認後點選
                                        「新增選項」
                                        至報價系統
                                    </p>
                                </div>
                                <div class="col5">
                                    <p class="img"><img src="/assets/img/howto_img02.png" alt=""></p>
                                    <p class="txt">
                                        <span class="num">Step2</span>
                                        選擇想入
                                        住的住宿選項、
                                        週數，確認後點選
                                        「新增選項」
                                        至報價系統
                                    </p>
                                </div>
                                <div class="col5">
                                    <p class="img"><img src="/assets/img/howto_img03.png" alt=""></p>
                                    <p class="txt">
                                        <span class="num">Step3</span>
                                        若想透過學校安
                                        排接機服務，
                                        請在學校其他費
                                        用選擇
                                    </p>
                                </div>
                                <div class="col5">
                                    <p class="img"><img src="/assets/img/howto_img04.png" alt=""></p>
                                    <p class="txt">
                                        <span class="num">Step4</span>
                                        下方將會顯示
                                        所需的台幣、
                                        外幣總額
                                    </p>
                                </div>
                                <div class="col5">
                                    <p class="img"><img src="/assets/img/howto_img05.png" alt=""></p>
                                    <p class="txt">
                                        <span class="num">Step5</span>
                                        取得edm專屬優惠價、
                                        確認最終報價資料，
                                        請與我們聯繫v
                                    </p>
                                </div>
                            </div>
                        </div>
                    @endif

                    <ul class="nav nav-tabs year-nav">
                    @foreach ($year_list->reverse() as $y)
                        <li class="nav-item">
                            <a href="{{ route('search_language-school-caculator', [$school->school_id, 'year' => $y]) }}" class="nav-link {{ $y == $year ? 'active' : '' }}">{{ $y }}</a>
                        </li>
                    @endforeach
                    </ul>

                    <div class="estimate-select-table">
                        <table>
                            <colgroup>
                                <col width="33.33%"/>
                                <col width="*"/>
                                <col width="33.33%"/>
                            </colgroup>
                            <thead>
                                <tr>
                                    <th>學費</th>
                                    <th>住宿費</th>
                                    <th>學校其他費用</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>
                                        @include('frontend.search.calculator.template-search-course', [
                                            'school_id' => $school->school_id,
                                            'year' => $year,
                                            'course_list' => $course_list,
                                        ])
                                    </td>
                                    <td>
                                        @include('frontend.search.calculator.template-search-stay', [
                                            'school_id' => $school->school_id,
                                            'year' => $year,
                                            'stay_list' => $stay_list,
                                        ])
                                    </td>
                                    <td>
                                        @include('frontend.search.calculator.template-search-etc', [
                                            'school_id' => $school->school_id,
                                            'year' => $year,
                                            'etc_list' => $etc_list,
                                        ])
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>

                    <div class="estimate-price-table tuition">
                        <div class="clearfix title">
                            <strong>學費(Tuition)</strong>
                            <div class="right-wrap">
                                <button class="complete">確認</button>
                                <button class="edit">編輯</button>
                            </div>
                        </div>
                        <table>
                            <colgroup>
                                <col width="56%">
                                <col width="10%">
                                <col width="17%">
                                <col width="17%">
                            </colgroup>
                            <thead>
                                <tr>
                                    <th>申請項目</th>
                                    <th>時間</th>
                                    <th>費用(外幣)</th>
                                    <th>費用(NT$)</th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                            <tfoot>
                                <tr>
                                    <td colspan="3">小計</td>
                                    <td>NT$ <strong class="total">0</strong></td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>

                    <div class="estimate-price-table accommodation">
                        <div class="clearfix title">
                            <strong>住宿費(Accommodation)</strong>
                            <div class="right-wrap">
                                <button class="complete">確認</button>
                                <button class="edit">編輯</button>
                            </div>
                        </div>
                        <table>
                            <colgroup>
                                <col width="56%">
                                <col width="10%">
                                <col width="17%">
                                <col width="17%">
                            </colgroup>
                            <thead>
                                <tr>
                                    <th>申請項目</th>
                                    <th>時間</th>
                                    <th>費用(外幣)</th>
                                    <th>費用(NT$)</th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                            <tfoot>
                                <tr>
                                    <td colspan="3">小計</td>
                                    <td>NT$ <strong class="total">0</strong></td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>

                    <div class="estimate-price-table others">
                        <div class="clearfix title">
                            <strong>學校其他費用</strong>
                            <div class="right-wrap">
                                <button class="complete">確認</button>
                                <button class="edit">編輯</button>
                            </div>
                        </div>
                        <table>
                            <colgroup>
                                <col width="56%">
                                <col width="10%">
                                <col width="17%">
                                <col width="17%">
                            </colgroup>
                            <thead>
                                <tr>
                                    <th colspan="2">申請明細</th>
                                    <th>費用(外幣)</th>
                                    <th>費用(NT$)</th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                            <tfoot>
                                <tr>
                                    <td colspan="3">小計</td>
                                    <td>NT$ <strong class="total">0</strong></td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>

                    @if (isOffice())
                        <div class="estimate-price-table benefit">
                            <div class="clearfix title">
                                <strong>ed:m 專屬優惠</strong>
                                <div class="right-wrap">
                                    <button class="enable">ed:m獎學金顯示</button>
                                    <button class="disable">隱藏</button>
                                    <button class="add">新增</button>
                                    <button class="complete">確認</button>
                                    <button class="edit">編輯</button>
                                </div>
                            </div>
                            <table>
                                <colgroup>
                                    <col width="66%">
                                    <col width="17%">
                                    <col width="17%">
                                </colgroup>
                                <thead>
                                    <tr>
                                        <th>優惠明細</th>
                                        <th>費用(外幣)</th>
                                        <th>費用(NT$)</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr class="template">
                                        <td>
                                            <div>
                                                <button type="button" class="btn-del" onclick="removeItem(this)"></button> <input type="text"/>
                                            </div>
                                            <div class="cost_twd"></div>
                                        </td>
                                        <td class="box">
                                            <span class="currency">{{ getCurrencySymbol($school->currency) }}</span>
                                            <input type="text" class="number pay-cost empty" onkeyup="calcBenefit(this)" onkeypress="resetOtherCost(this); return checkNumber(event)"/>
                                        </td>
                                        <td class="box">
                                            <span class="currency">NT$</span>
                                            <input type="text" class="number pay-cost_twd empty" onkeyup="calcBenefit(this)" onkeypress="resetOtherCost(this); return checkNumber(event)"/>
                                        </td>
                                    </tr>
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <td colspan="2">小計</td>
                                        <td>NT$ <strong class="total">0</strong></td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    @endif

                    <div class="estimate-total-table">
                        <div class="price-total" id="price-total">
                            <p class="price price-local col2">
                                <span class="title">外幣總額</span>
                                <strong class="val">{{ getCurrencySymbol($school->currency) }} <em>0</em></strong>
                            </p>
                            <p class="price price-twd col2">
                                <span class="title">台幣總額</span>
                                <strong class="val">NT$ <em>0</em></strong>
                            </p>
                        </div>
                        <p class="exp">匯率 : NT$ {{ $exchangeRate }} (1GBP) / 報價日期 : {{ ExchangeRate::time()->format('Y年 m月 d日') }}</p>
                    </div>

                    <div class="estimate-inform-area">
                        <div class="clearfix title">
                            <strong>注意事項</strong>
                        </div>
                        <textarea {{ isOffice() ? '' : 'readonly' }}>
1. 台幣費用金額以匯款當天匯率為主
2. 實際學費及住宿金額，以學校實際繳費單為主
3. edm學生優惠: edm保有所有解釋及更改之權利
4. 以上報價不包含： 簽證、機票、交通費、個人生活費、小費等</textarea>
                    </div>
                    
                    <!-- 버튼 -->
                    <div class="button-wrap">
                        @if (isOffice())
                            <button class="print color" onclick="printDoc()">列印</button>
                            <button class="reset" onclick="window.location.reload()">重置</button>
                        @else
                            <button class="counsel color" onclick="window.location.href = '{{ route('channel_appointment') }}'">立即取得，完整報價</button>
                            <button class="counsel color" onclick="window.location.href = '{{ route('channel_appointment') }}'">聯絡我們，獲得優惠</button>
                        @endif
                    </div>
                    
                    <!-- 안내문구 : 인쇄시 출력 -->
                    <div class="print-notice">
                    </div>
                </div>
            </div>
            <div class="col-12 col-md-4">
                <div class="border sticky-sidebar mt-6 mt-md-0">
                    <div class="p-6">
                    @if ($school->website != '')
                    <div class="font-weight-bold mb-2">學校</div>
                    <p>
                        <a class="text-dark text-wrap" href="{{$school->website}}" target="_blank">
                            {{$school->website}}
                        </a>
                    </p>
                    @endif
                    <div class="font-weight-bold mb-2">學校社群</div>
                    <div class="mb-5 d-flex">
                        @if (isset($school->schoolSns) && count($school->schoolSns) > 0)
                        @foreach ($school->schoolSns as $k => $v)
                        <a class="btn-rounded btn-dark mr-2" href="{{$v->url}}" target="_blank">
                            <i class="fab fa-fw fa-xs fa-{{$v->sns}}"></i>
                        </a>
                        @endforeach
                        @endif
                    </div>
                    <div class="font-weight-bold mb-2">學校地址</div>
                    <p>{{$school->address}}</p>
                    <div class="font-weight-bold mb-2">學校連繫</div>
                    <p>
                        {{$school->telephone}}
                    </p>
                    @if ($school->view360 != '')
                    <div class="mb-5 d-lg-block">
                        <a class="btn btn-outline-primary" href="{{$school->view360}}" target="_blank">看3D視圖</a>
                    </div>
                    @endif
                    <div class="mb-4">
                        <div id="map-canvas" class="map-sm"></div>
                    </div>
                    <div class="d-lg-block">
                        <a class="btn btn-block btn-primary" href="{{ route('channel_appointment') }}" target="_blank">預約諮詢</a>
                    </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="nav-mobile-search">
        <a class="btn btn-block btn-primary" href="javascript:void();" data-toggle="modal" data-target="#modal-price">
            索取報價
        </a>
    </div>
</main>
@stop

@section('modal')
    @include('frontend.module.modal-search-price')
@stop
@section('js')

<!-- Google Map API -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD6piIpu_iVGX8ZNUF5F8GWr2udHRYMxJ0&callback=initMap" type="text/javascript"></script>
<script>
function initMap() {
    var mylatlng = {lat: {{$school->lat}}, lng: {{$school->lng}}};
    var map = new google.maps.Map(document.getElementById('map-canvas'), {
        zoom: 15,
        center: mylatlng,
        disableDefaultUI: true
    });
    var icon = {
        url: "/assets/img/ui/map-pin.png", // url
        scaledSize: new google.maps.Size(26, 43), // scaled size
    };
    var marker = new google.maps.Marker({
        position: mylatlng,
        map: map,
        icon: icon,
    });
}

$('#form').submit(function(event) {
    event.preventDefault();
    $.ajax({
        url: '{{ route('contact_add') }}',
        data: $('#form').serialize(),
        type: 'POST',
        success: function(response) {
            alert(response);
            $('#name').val('');
            $('#phone').val('');
            $('#email').val('');
            $('#customCheck-agree').prop('checked', false);
            $('#modal-price').modal();
        }
    });
});

$(function () {
    $("#customCheck-custom").click(function () {
        if ($(this).is(":checked")) {
            $("#custom-item").show();
        } else {
            $("#custom-item").hide();
        }
    });
});
</script>
@stop
{{--     
    <!-- modal-索取報價 -->
    <div class="modal-search-price"></div>

    <!-- modal-states -->
    <div class="modal-states"></div>
    <!-- ./modal-states -->

    <!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-W53SKVJ"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

<script src="../assets/js/kule.urbrowser.min.js" id="urbrowser" data-domain="www.edmtw.com"></script>
	<script src="../assets/js/jquery/jquery-3.3.1.min.js?v=1537528068"></script>
	<script src="../assets/js/vendor/bootstrap.bundle.min.js"></script>
    <script src="../assets/js/vendor/bootstrap.responsive-paginate.js"></script>
	<script src="../assets/js/vendor/jquery.slick.min.js"></script>
	<script src="../assets/js/vendor/jquery.hc-sticky.min.js"></script>
	<script src="../assets/js/vendor/jquery.pushy.min.js"></script>
	<script src="../assets/js/jquery/jquery.scrollbar.min.js?v=1537528068"></script>
	<script src="../assets/js/jquery/owl.carousel.min.js?v=1537528068"></script>
    <script src="../assets/js/main.js?v=1538384436"></script>
	<script src="../assets/js/custom.js"></script>

    <!-- module include -->
    <script src="../assets/js/function/module.js"></script>
    <script>
        $(".modal-search-price").load("../module/modal-search-price.html");
        $(".modal-states").load("../module/modal-states.html");
    </script>
    
    <!-- Google Map API -->
    <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD6piIpu_iVGX8ZNUF5F8GWr2udHRYMxJ0&callback=initMap" type="text/javascript"></script>
    <script>
        function initMap() {
            var mylatlng = {lat: 51.517, lng: -0.140};
            var map = new google.maps.Map(document.getElementById('map-canvas'), {
                zoom: 15,
                center: mylatlng,
                disableDefaultUI: true
            });
            var icon = {
                url: "../assets/img/ui/map-pin.png", // url
                scaledSize: new google.maps.Size(26, 43), // scaled size
            };
            var marker = new google.maps.Marker({
                position: mylatlng,
                map: map,
                icon: icon,
            });
        }
    </script>

    <!-- single -->
    <script>
        $(function () {
            $("#customCheck-custom").click(function () {
                if ($(this).is(":checked")) {
                    $("#custom-item").show();
                } else {
                    $("#custom-item").hide();
                }
            });
        });
        $.home();
    </script>
    </body>
</html> --}}