@extends('adminlte::page')

@section('title', '購入機器新規登録')

@section('content_header')
    <h5><label class="title-underbar">購入機器新規登録</label></h5>
@stop

@section('content')
    <x-admin.success-flush-message />
    <x-admin.error-flush-message />
    <x-admin.validation-message />
    <div id="equipment_type_not_select" class="alert alert-warning" style="display:none;">購入機器情報の形式を選択して下さい。</div>
    <div id="equipment_type_not_supported" class="alert alert-warning" style="display:none;">こちらの購入機器はアフターサポートパックに対応していません。</div>
    @php
        $msgAssociation = '';
        if (empty($clinic->sfaClinic)) {
            $msgAssociation = '医院についてSFAデータとの関連付けを実施して下さい。';
        } elseif (!$clinic->sfaClinic->affiliate_id) {
            $msgAssociation = '医院に関連付いているSFA医院に担当部署が設定されておりません。csvファイル上の部署に関する記載内容を確認して下さい。部署マスタにcsvファイル記載の部署が登録されていなければ、部署を登録して下さい。';
        } elseif (empty($clinic->sfaClinic->affiliate)) {
            $msgAssociation = '医院に関連付いているSFA医院の担当部署が部署マスタに登録されておりません。csvファイル記載の部署を部署マスタに登録して下さい。';
        } elseif (empty($clinic->sfaClinic->affiliate->employee) || $clinic->sfaClinic->affiliate->employee->count() == 0) {
            $msgAssociation = '医院に関連付いているSFA医院の担当部署に従業員が存在しません。担当部署に従業員を登録して下さい。';
        }
    @endphp
    @if($msgAssociation)
    <div class="alert alert-danger">{{ $msgAssociation }}</div>
    @endif
    <div class="row">
        <div class="col-md-12">
            <div class="card" style="border-radius: 20px; box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.04);">
                <div class="card-body">
                    <div class="row flex-column flex-md-row" style="margin: 30px 12px 10px; margin-bottom: 5px">
                        <div class="col-md-3 pt-2 py-2 my-2 my-md-0 medium-heading d-flex align-items-center" style="background-color: #F5F5F5">
                            <b style="margin-left: 10px;">{{ '医院登録情報' }}</b>
                        </div>
                        <div class="col-md-9 main-text">
                            <div class="row" style="margin-bottom: 10px;">
                                <div class="col-md-3 col-4">
                                    <b style="margin-left: 10px;">{{ '医院名' }}</b>
                                </div>
                                <div class="col-1">
                                    <b>：</b>
                                </div>
                                <div class="col-md-8 col-7">
                                    {{ !empty($clinic->name) ? $clinic->name : ''; }}
                                </div>
                            </div>

                            <div class="row" style="margin-bottom: 10px;">
                                <div class="col-md-3 col-4">
                                    <b style="margin-left: 10px;">{{ '電話番号' }}</b>
                                </div>
                                <div class="col-1">
                                    <b>：</b>
                                </div>
                                <div class="col-md-8 col-7">
                                    {{ !empty($clinic->phone_number) ? $clinic->phone_number : ''; }}
                                </div>
                            </div>

                            <div class="row" style="margin-bottom: 10px;">
                                <div class="col-md-3 col-4">
                                    <b style="margin-left: 10px;">{{ '郵便番号' }}</b>
                                </div>
                                <div class="col-1">
                                    <b>：</b>
                                </div>
                                <div class="col-md-8 col-7">
                                    {{ !empty($clinic->postal_code) ? $clinic->postal_code : ''; }}
                                </div>
                            </div>

                            <div class="row" style="margin-bottom: 10px;">
                                <div class="col-md-3 col-4">
                                    <b style="margin-left: 10px;">{{ '住所' }}</b>
                                </div>
                                <div class="col-1">
                                    <b>：</b>
                                </div>
                                <div class="col-me-8 col-7">
                                    {{ !empty($clinic->city) ? $clinic->city : ''; }}
                                    {{ !empty($clinic->street_address) ? $clinic->street_address : ''; }}
                                    {{ !empty($clinic->address) ? $clinic->address : ''; }}
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row flex-column flex-md-row row_support_pack" style="margin: 15px 12px 10px; margin-bottom: 5px">
                        <div class="col-md-3 pt-2 py-2 my-2 my-md-0 medium-heading d-flex align-items-center" style="background-color: #F5F5F5">
                            <b style="margin: 0px 10px;">{{ '購入機器情報' }}</b>
                        </div>
                        <div class="col-md-9">
                            <div id="row_support_pack_sfa_product_id" class="row">
                                <div class="col-label col-3 medium-heading d-flex align-items-center" style="background-color: #F5F5F5; border: solid #FFF; border-top: none; border-right: none;">
                                    <b style="margin: 0px 10px;">{{ 'ジャンル' }}</b>
                                </div>
                                <div class="col-9 main-text" style="padding-top:0.3rem;padding-bottom:0.3rem;">
                                    <select form="association" id="equipment_genre" name="equipment_genre" class="form-control main-text" required>
                                        <option></option>
                                    @foreach(EquipmentGenreHelper::allEquipmentGenres() as $key => $value)
                                        <option value="{{ $key }}">{{ $value }}</option>
                                    @endforeach
                                    </select>
                                </div>
                            </div>
                            <div id="row_support_pack_sfa_product_id" class="row">
                                <div class="col-label col-3 medium-heading d-flex align-items-center" style="background-color: #F5F5F5; border: solid #FFF; border-top: none; border-right: none;">
                                    <b style="margin: 0px 10px;">{{ '機器' }}</b>
                                </div>
                                <div class="col-9 main-text" style="padding-top:0.3rem;padding-bottom:0.3rem;">
                                    <select form="association" id="equipment" name="equipment" class="form-control main-text" required>
                                    </select>
                                </div>
                            </div>
                            <div id="row_support_pack_sfa_product_id" class="row">
                                <div class="col-label col-3 medium-heading d-flex align-items-center" style="background-color: #F5F5F5; border: solid #FFF; border-top: none; border-right: none;">
                                    <b style="margin: 0px 10px;">{{ '形式' }}</b>
                                </div>
                                <div class="col-9 main-text" style="padding-top:0.3rem;padding-bottom:0.3rem;">
                                    <select form="association" id="equipment_type" name="equipment_type" class="form-control main-text" required>
                                    </select>
                                </div>
                            </div>
                            <div id="row_support_pack_sfa_product_id" class="row">
                                <div class="col-label col-3 medium-heading d-flex align-items-center" style="background-color: #F5F5F5; border: solid #FFF; border-top: none; border-right: none;">
                                    <b style="margin: 0px 10px;">{{ '製造番号' }}</b>
                                </div>
                                <div class="pl-2 pt-0 pt-md-2 col-label col-9 main-text" style="padding-top:0.3rem;padding-bottom:0.3rem;">
                                    <input type="text" form="association" id="serial_number" name="serial_number" class="form-control main-text" value="" required></select>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row" style="margin: 15px 12px 10px; margin-bottom: 5px">
                        <div class="col-label col-3 medium-heading d-flex align-items-center" style="background-color: #F5F5F5">
                            <b style="margin: 0px 10px;">{{ 'SFA売上情報' }}</b>

                            @if (Gate::forUser(\Auth::user())->allows('employeeOperation', 'clinics|2'))
                                <div class="col-6">
                                    <button class="btn btn-sm btn-block button-go rounded-pill" data-toggle="modal" data-target="#sale">選択</button>
                                </div>
                            @endif
                        </div>
                        <div class="col-9">
                            <div id="row_sfa_sale_no_relation" class="mb-0 ml-2 row d-flex align-items-center" style="margin-left: 10px; height: 60px;">
                                {{ 'SFA情報と関連付け登録されていません' }}
                            </div>
                            <div id="row_sfa_clinic" class="row" style="display:none;">
                                <div class="col-label col-3 medium-heading d-flex align-items-center" style="background-color: #F5F5F5; border: solid #FFF; border-top: none; border-right: none;">
                                    <b style="margin: 0px 10px;">{{ '医院情報' }}</b>
                                </div>
                                <div class="col-9 main-text">
                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ 'SFAクライアントコード' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="sfa_customer_id" class="col-8"></div>
                                    </div>
    
                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ '医院名' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="sfa_clinic_name" class="col-8">
                                            
                                        </div>
                                    </div>
    
                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ '電話番号' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="phone_number" class="col-8">
                                            
                                        </div>
                                    </div>
    
                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ '郵便番号' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="postal_code" class="col-8">
                                            
                                        </div>
                                    </div>
    
                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ '住所' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="address" class="col-8">
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div id="row_sfa_sale" class="row" style="display:none;">
                                <div class="col-label col-3 medium-heading d-flex align-items-center" style="background-color: #F5F5F5; border: solid #FFF; border-bottom: none; border-right: none;">
                                    <b style="margin: 0px 10px;">{{ '売上情報' }}</b>
                                </div>
                                <div class="col-9 main-text">
                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ '納入機器ID' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="supply_equipment_id" class="col-8"></div>
                                    </div>
    
                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ 'SFA商品分類' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="sfa_product_category_name_sale" class="col-8"></div>
                                    </div>
    
                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ '商品名' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="product_name_sale" class="col-8"></div>
                                    </div>
    
                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ '形式' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="equipment_type_sale" class="col-8"></div>
                                    </div>

                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ 'ロット・製番' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="serial_number" class="col-8"></div>
                                    </div>

                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ '納品/売上日' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="sales_date" class="col-8"></div>
                                    </div>

                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ 'アフターサポートパック加入ステータス' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="after_support_status" class="col-8">
                                            <span></span>
                                            <input form="association" type="hidden" name="after_support_status" value="">
                                        </div>
                                    </div>

                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ 'アフターサポートパック加入日' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="after_support_joined_date" class="col-8"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row" style="margin: 15px 12px 10px; margin-bottom: 5px">
                        <div class="col-label col-3 medium-heading d-flex align-items-center" style="background-color: #F5F5F5">
                            <b style="margin: 0px 10px;">{{ 'SFA商品情報' }}</b>
                            @if (Gate::forUser(\Auth::user())->allows('employeeOperation', 'clinics|2'))
                                <div class="col-6">
                                    <button class="btn btn-sm btn-block button-go rounded-pill" data-toggle="modal" data-target="#product">選択</button>
                                </div>
                            @endif
                        </div>
                        <div class="col-9">
                            <div id="row_sfa_product_no_relation" class="mb-0 ml-2 row d-flex align-items-center" style="margin-left: 10px; height: 60px;">
                                {{ 'SFA情報と関連付け登録されていません' }}
                            </div>
                            <div id="row_sfa_product" class="row mb-0 ml-2" style="display:none;">
                                <div class="col-12 main-text">
                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ 'システムID' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="system_id" class="col-8">
                                        </div>
                                    </div>

                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ 'SFA商品分類' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="sfa_category_name" class="col-8">
                                        </div>
                                    </div>

                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ '商品コード' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="product_code" class="col-8">
                                        </div>
                                    </div>

                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ '商品名' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="product_name" class="col-8">
                                        </div>
                                    </div>

                                    <div class="row" style="margin-bottom: 10px;">
                                        <div class="col-3">
                                            <b style="margin-left: 10px;">{{ '形式' }}</b>
                                        </div>
                                        <div class="col-1">
                                            <b>：</b>
                                        </div>
                                        <div id="product_type" class="col-8">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row row_support_pack flex-column flex-md-row" style="margin: 15px 12px 10px; margin-bottom: 5px">
                        <div class="col-md-3 pt-2 py-2 my-2 my-md-0 medium-heading d-flex align-items-center" style="background-color: #F5F5F5">
                            <b style="margin: 0px 10px;">{{ 'アフターサポートパック' }}</b>
                        </div>
                        <div class="col-md-9">
                            <div id="row_support_pack_sfa_product_id" class="row">
                                <div class="col-label col-3 medium-heading d-flex align-items-center" style="background-color: #F5F5F5; border: solid #FFF; border-top: none; border-right: none;">
                                    <b style="margin: 0px 10px;">{{ '加入プラン' }}</b>
                                </div>
                                <div class="col-9 main-text" style="padding-top:0.3rem;padding-bottom:0.3rem;">
                                    <input form="association" type="hidden" id="is_join_support_pack" name="is_join_support_pack" value="">
                                    <select form="association" id="support_pack_sfa_product_id" name="support_pack_sfa_product_id" class="form-control main-text" disabled="disabled" required>
                                        <option value=""></option>
                                    @foreach (SfaProductHelper::celbyTipAfterSupportPackProducts() as $celbyTipAfterSupportPackProduct)
                                        @if(!empty($sfaSaleRelation->support_pack_sfa_product_id) && $sfaSaleRelation->support_pack_sfa_product_id == $celbyTipAfterSupportPackProduct['key'])
                                            <option class="celbyTip {{ $celbyTipAfterSupportPackProduct['grade'] }}" value="{{ $celbyTipAfterSupportPackProduct['key'] }}" selected>{{ $celbyTipAfterSupportPackProduct['value'] }}</option>
                                        @else
                                            <option class="celbyTip {{ $celbyTipAfterSupportPackProduct['grade'] }}" value="{{ $celbyTipAfterSupportPackProduct['key'] }}">{{ $celbyTipAfterSupportPackProduct['value'] }}</option>
                                        @endif
                                    @endforeach
                                    @foreach (SfaProductHelper::celbyProbeAfterSupportPackProducts() as $celbyProbeAfterSupportPackProduct)
                                        @if(!empty($sfaSaleRelation->support_pack_sfa_product_id) && $sfaSaleRelation->support_pack_sfa_product_id == $celbyProbeAfterSupportPackProduct['key'])
                                            <option class="celbyProbe {{ $celbyProbeAfterSupportPackProduct['grade'] }}" value="{{ $celbyProbeAfterSupportPackProduct['key'] }}" selected>{{ $celbyProbeAfterSupportPackProduct['value'] }}</option>
                                        @else
                                            <option class="celbyProbe {{ $celbyProbeAfterSupportPackProduct['grade'] }}" value="{{ $celbyProbeAfterSupportPackProduct['key'] }}">{{ $celbyProbeAfterSupportPackProduct['value'] }}</option>
                                        @endif
                                    @endforeach
                                    @foreach (SfaProductHelper::unitAfterSupportPackProducts() as $unitAfterSupportPackProduct)
                                        @if(!empty($sfaSaleRelation->support_pack_sfa_product_id) && $sfaSaleRelation->support_pack_sfa_product_id == $unitAfterSupportPackProduct['key'])
                                            <option class="unit {{ $unitAfterSupportPackProduct['grade'] }}" value="{{ $unitAfterSupportPackProduct['key'] }}" selected>{{ $unitAfterSupportPackProduct['value'] }}</option>
                                        @else
                                            <option class="unit {{ $unitAfterSupportPackProduct['grade'] }}" value="{{ $unitAfterSupportPackProduct['key'] }}">{{ $unitAfterSupportPackProduct['value'] }}</option>
                                        @endif
                                    @endforeach
                                    @foreach (SfaProductHelper::daisyAfterSupportPackProducts() as $daisyAfterSupportPackProduct)
                                        @if(!empty($sfaSaleRelation->support_pack_sfa_product_id) && $sfaSaleRelation->support_pack_sfa_product_id == $daisyAfterSupportPackProduct['key'])
                                            <option class="daisy {{ $daisyAfterSupportPackProduct['grade'] }}" value="{{ $daisyAfterSupportPackProduct['key'] }}" selected>{{ $daisyAfterSupportPackProduct['value'] }}</option>
                                        @else
                                            <option class="daisy {{ $daisyAfterSupportPackProduct['grade'] }}" value="{{ $daisyAfterSupportPackProduct['key'] }}">{{ $daisyAfterSupportPackProduct['value'] }}</option>
                                        @endif
                                    @endforeach
                                    </select>
                                </div>
                            </div>
                            <div id="row_support_pack_joined_date" class="row">
                                <div class="col-label col-3 medium-heading d-flex align-items-center" style="background-color: #F5F5F5; border: solid #FFF; border-top: none; border-right: none;">
                                    <b style="margin: 0px 10px;">{{ '加入日' }}</b>
                                </div>
                                <div class="col-9 main-text" style="padding-top:0.3rem;padding-bottom:0.3rem;">
                                    <input form="association" type="date" id="select_support_pack_joined_date" name="select_support_pack_joined_date" value="" disabled="disabled" required>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="col-md-8" style="margin:50px 0px">
                        <div class="row">
                            <form id="association" method="post" action="{{ route('productpromotion.admin.purchased-equipment.store', ['clinic_id' => $clinic->id]) }}">
                                @csrf
                                <input type="hidden" name="clinic_id" value="{{ $clinic->id }}" />
                                <input type="hidden" id="sfa_sale_id" name="sfa_sale_id" value="" />
                                <input type="hidden" id="sfa_product_id" name="sfa_product_id" value="" />
                            </form>
                        </div>
                        <div class="row">
                            <div class="col-md-3 btn-wrap">
                                <a id="page-back" href="{{ route('productpromotion.admin.purchased-equipment.index', ['clinic_id' => $clinic->id]) }}" class="btn btn-block button-back btn-lg rounded-pill">
                                    {{ 'キャンセル' }}
                                </a>
                            </div>
                            @if(Gate::forUser(\Auth::user())->allows('employeeOperation', 'clinics|2'))
                            <div class="col-md-3">
                                <button type="submit" id="submit" form="association" class="btn btn-block button-go btn-lg rounded-pill" disabled="disabled">登録</button>
                            </div>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {{-- Modal --}}
    @include('productpromotion::admin.searchSfa.modal.product')
    @include('productpromotion::admin.searchSfa.modal.sale')
    @include('productpromotion::admin.purchasedEquipmentAssociation.modal.delete')
@stop

@section('css')
    <link rel="stylesheet" href="/css/admin_custom.css">
    <style>
        .button-red {
            background-color: #FF6565;
            color: #fff;
            font-size: 16px;
            transition: background-color 0.3s ease;
        }

        .button-red:hover {
            background-color: #FF0000;
            color: #fff;
        }

        #loading {
            position: fixed;
            top: 50%;
            left: 50%;
            z-index: 10000;
        }
    </style>
@stop

@section('js')
    <script>
        const arySupportPackEquipmentId = [
            @foreach(\Modules\ProductPromotion\Entities\EquipmentType::CELBY_TIP_SUPPORT_PACK_EQUIPMENT_TYPE_ID_LIST as $celbyTipSupportPackEquipmentId)
                {{ $celbyTipSupportPackEquipmentId }},
            @endforeach
            @foreach(\Modules\ProductPromotion\Entities\EquipmentType::CELBY_PROBE_SUPPORT_PACK_EQUIPMENT_TYPE_ID_LIST as $celbyTipSupportPackEquipmentId)
                {{ $celbyTipSupportPackEquipmentId }},
            @endforeach
            @foreach(\Modules\ProductPromotion\Entities\EquipmentType::UNIT_SUPPORT_PACK_EQUIPMENT_TYPE_ID_LIST as $celbyTipSupportPackEquipmentId)
                {{ $celbyTipSupportPackEquipmentId }},
            @endforeach
            @foreach(\Modules\ProductPromotion\Entities\EquipmentType::DAISY_SUPPORT_PACK_EQUIPMENT_TYPE_ID_LIST as $celbyTipSupportPackEquipmentId)
                {{ $celbyTipSupportPackEquipmentId }},
            @endforeach
        ];
        const aryCelbyTipSupportPackEquipmentId = [
            @foreach(\Modules\ProductPromotion\Entities\EquipmentType::CELBY_TIP_SUPPORT_PACK_EQUIPMENT_TYPE_ID_LIST as $celbyTipSupportPackEquipmentId)
                {{ $celbyTipSupportPackEquipmentId }},
            @endforeach
        ];
        const aryCelbyProbeSupportPackEquipmentId = [
            @foreach(\Modules\ProductPromotion\Entities\EquipmentType::CELBY_PROBE_SUPPORT_PACK_EQUIPMENT_TYPE_ID_LIST as $celbyProbeSupportPackEquipmentId)
                {{ $celbyProbeSupportPackEquipmentId }},
            @endforeach
        ];
        const aryUnitSupportPackEquipmentId = [
            @foreach(\Modules\ProductPromotion\Entities\EquipmentType::UNIT_SUPPORT_PACK_EQUIPMENT_TYPE_ID_LIST as $unitSupportPackEquipmentId)
                {{ $unitSupportPackEquipmentId }},
            @endforeach
        ];
        const aryDaisySupportPackEquipmentId = [
            @foreach(\Modules\ProductPromotion\Entities\EquipmentType::DAISY_SUPPORT_PACK_EQUIPMENT_TYPE_ID_LIST as $daisySupportPackEquipmentId)
                {{ $daisySupportPackEquipmentId }},
            @endforeach
        ];

        {{--
            形式マスタIDに対する形式選択肢表示制御で扱うクラス名を取得.
            @param {string} equipmentTypeId 形式マスタID.
            @returns {string} 形式選択肢表示制御で扱うクラス名.
        --}}
        const getDisplayEquipmentTypeClassName = function (equipmentTypeId) {
            if (aryCelbyTipSupportPackEquipmentId.includes(Number(equipmentTypeId))) {
                return 'celbyTip';
            } else if (aryCelbyProbeSupportPackEquipmentId.includes(Number(equipmentTypeId))) {
                return 'celbyProbe';
            } else if (aryUnitSupportPackEquipmentId.includes(Number(equipmentTypeId))) {
                return 'unit';
            } else if (aryDaisySupportPackEquipmentId.includes(Number(equipmentTypeId))) {
                return 'daisy';
            }
            return '';
        }

        {{--
            アフターサポートパックステータス値に対するアフターサポートパック加入プラン表示制御で扱うクラス名を取得.
            @param {string} afterSupportStatus アフターサポートパックステータス値.
            @returns {string} アフターサポートパック加入プラン表示制御で扱うクラス名.
        --}}
        const getSupportPackGradeClassName = function (afterSupportStatus) {
            if (afterSupportStatus == {{ \App\Models\SfaSale::AFTER_SUPPORT_STATUS_ECONOMY }}) {
                return 'economy';
            } else if (afterSupportStatus == {{ \App\Models\SfaSale::AFTER_SUPPORT_STATUS_STANDARD }}) {
                return 'standard';
            } else if (afterSupportStatus == {{ \App\Models\SfaSale::AFTER_SUPPORT_STATUS_PREMIUM }}) {
                return 'premium';
            }
            return '';
        }

        {{-- アフターサポートパック関連の初期化 --}}
        const initAfterSupport = function () {
            {{-- アフターサポートパック加入プラン、加入日、検査項目初期化 --}}
            $('select#support_pack_sfa_product_id').prop('disabled', true);
            $('select#support_pack_sfa_product_id').prop('required', true);
            $('input#select_support_pack_joined_date').prop('disabled', true);
            $('input#select_support_pack_joined_date').prop('readonly', false);
            $('input#select_support_pack_joined_date').val('');
            $('button#btn_maintenance_survey').prop('disabled', true);
            {{-- アフターサポートパック加入プラン選択初期化 --}}
            $('select#support_pack_sfa_product_id').val('');
            $(`select#support_pack_sfa_product_id option[value='']`).show();
            $('select#support_pack_sfa_product_id option.celbyTip').hide();
            $('select#support_pack_sfa_product_id option.celbyProbe').hide();
            $('select#support_pack_sfa_product_id option.unit').hide();
            $('select#support_pack_sfa_product_id option.daisy').hide();
            {{-- アフターサポートパック加入指定初期化 --}}
            $('input#is_join_support_pack').val('0');
        };

        {{-- アフターサポートパック加入日初期化 --}}
        const initSelectAfterSupportJoinedDate = function () {
            $('input#select_support_pack_joined_date').val('');
        }

        {{-- アフターサポートパック検査項目初期化 --}}
        const initMaintenanceSurvey = function () {
            $('input#maintenance_survey_id').val('');
            $('span#maintenance_survey_name').text('');
        }

        {{--
            形式マスタIDに沿った選択可能なアフターサポートパック加入プラン選択肢のみになる様に反映.
            @param {string} equipmentTypeId 形式マスタID.
            @returns {string} 形式マスタIDに対する形式選択肢表示制御で扱うクラス名.
        --}}
        const applyAfterSupportPlanChoices = function (equipmentTypeId) {
            {{-- 形式マスタIDに対する形式選択肢表示制御で扱うクラス名を取得 --}}
            const displayEquipmentTypeClassName = getDisplayEquipmentTypeClassName(equipmentTypeId);
            {{-- アフターサポートパック加入プランの選択肢を対象形式のプラン選択肢のみ表示 --}}
            $(`select#support_pack_sfa_product_id option.${displayEquipmentTypeClassName}`).show();
            return displayEquipmentTypeClassName;
        }

        {{--
            形式マスタIDとアフターサポートパックステータス値に沿った
            加入中のアフターサポートパック加入プラン選択肢のみになる様に反映.
            @param {string} equipmentTypeId 形式マスタID.
            @returns {string} 形式マスタIDに対する形式選択肢表示制御で扱うクラス名.
        --}}
        const applyAfterSupportPlanChoiceOnly = function (equipmentTypeId, afterSupportStatus) {
            {{-- 形式マスタIDに対する形式選択肢表示制御で扱うクラス名を取得 --}}
            const displayEquipmentTypeClassName = getDisplayEquipmentTypeClassName(equipmentTypeId);
            {{-- アフターサポートパックステータス値に対するアフターサポートパック加入プラン表示制御で扱うクラス名を取得 --}}
            const supportPackGradeClassName = getSupportPackGradeClassName(afterSupportStatus);
            if (displayEquipmentTypeClassName && supportPackGradeClassName) {
                {{-- 加入中のプラン情報のみ表示し強制選択 --}}
                $(`select#support_pack_sfa_product_id option[value='']`).hide();
                $(`select#support_pack_sfa_product_id option.${displayEquipmentTypeClassName}.${supportPackGradeClassName}`).show();
                $('select#support_pack_sfa_product_id').val($(`select#support_pack_sfa_product_id option.${displayEquipmentTypeClassName}.${supportPackGradeClassName}`).val());
            }
            return displayEquipmentTypeClassName;
        }

        {{--
            購入機器情報の形式変更時またはSFA売上情報変更時に実施される共通処理.
            加入中のアフターサポートパック加入プラン選択肢のみになる様に反映.
            @param {string} sfaSaleId SFA売上情報ID.
            @param {string} equipmentTypeId 形式マスタID.
            @param {string} afterSupportStatus アフターサポートパックステータス値.
            @param {string} supportPackJoinedAt アフターサポートパック加入日.
        --}}
        const changeEquipmentTypeOrSfaSaleImpl = function (sfaSaleId, equipmentTypeId, afterSupportStatus, supportPackJoinedAt) {
            {{-- 全警告一旦非表示 --}}
            $('div#equipment_type_not_select').hide();
            $('div#equipment_type_not_supported').hide();
            {{-- アフターサポートパック関連の初期化 --}}
            initAfterSupport();

            if (supportPackJoinedAt
                && afterSupportStatus
                && afterSupportStatus != {{ \App\Models\SfaSale::AFTER_SUPPORT_STATUS_JOINED }}
                && afterSupportStatus != {{ \App\Models\SfaSale::AFTER_SUPPORT_STATUS_NOT_JOINED }}) {
                {{-- アフターサポートパック加入状態と判断 --}}
                {{-- 加入のプラン詳細なしを弾いてるのは現状のデータではYSDヨシダのみでありこれは競合他社名と思われ無視して良いとのことから --}}

                if (equipmentTypeId === null || equipmentTypeId === '') {
                    {{-- 購入機器選択-未選択 --}}
                    {{-- アフターサポートパック加入日、検査項目初期化 --}}
                    initSelectAfterSupportJoinedDate();
                    initMaintenanceSurvey();
                    {{-- 購入機器選択を促す警告表示 --}}
                    $('div#equipment_type_not_select').show();
                } else if (arySupportPackEquipmentId.includes(Number(equipmentTypeId))) {
                    {{-- 購入機器選択-アフターサポートパック対象 --}}
                    {{-- 加入プラン強制選択なのでここで設定しておく --}}
                    $('input#is_join_support_pack').val('1');
                    {{-- アフターサポートパック加入プランを加入中のプランのみに絞り込む --}}
                    $('select#support_pack_sfa_product_id').prop('disabled', false);
                    const displayEquipmentTypeClassName = applyAfterSupportPlanChoiceOnly(equipmentTypeId, afterSupportStatus);
                    {{-- アフターサポートパック加入日を加入中の加入日に設定しておく --}}
                    $('input#select_support_pack_joined_date').prop('disabled', false);
                    $('input#select_support_pack_joined_date').prop('readonly', true);
                    $('input#select_support_pack_joined_date').val((supportPackJoinedAt.split('.')).join('-'));
                    {{-- アフターサポートパック検査項目選択可能に設定 --}}
                    $('button#btn_maintenance_survey').prop('disabled', false);
                } else {
                    {{-- 購入機器選択-アフターサポートパック対象外 --}}
                    {{-- アフターサポートパック加入日、検査項目初期化 --}}
                    initSelectAfterSupportJoinedDate();
                    initMaintenanceSurvey();
                    {{-- アフターサポートパック非対応の警告表示 --}}
                    $('div#equipment_type_not_supported').show();
                }
            } else {
                {{-- アフターサポートパック加入状態ではないと判断 --}}
                if (equipmentTypeId === null || equipmentTypeId === '') {
                    {{-- 購入機器選択-未選択 --}}
                    {{-- アフターサポートパック加入日、検査項目初期化 --}}
                    initSelectAfterSupportJoinedDate();
                    initMaintenanceSurvey();
                    {{-- 購入機器選択を促す警告表示 --}}
                    $('div#equipment_type_not_select').show();
                } else if (arySupportPackEquipmentId.includes(Number(equipmentTypeId))) {
                    {{-- 購入機器選択-アフターサポートパック対象 --}}
                    if (sfaSaleId) {
                        {{-- アフターサポートパック加入プラン選択可能に設定 --}}
                        $('select#support_pack_sfa_product_id').prop('disabled', false);
                        $('select#support_pack_sfa_product_id').prop('required', false);
                        {{-- アフターサポートパック加入日、検査項目選択可能に設定 --}}
                        $('input#select_support_pack_joined_date').prop('disabled', false);
                        $('input#select_support_pack_joined_date').prop('required', false);
                        $('button#btn_maintenance_survey').prop('disabled', false);
                        {{-- アフターサポートパック選択肢反映 --}}
                        applyAfterSupportPlanChoices(equipmentTypeId);
                    }
                } else {
                    {{-- 購入機器選択-アフターサポートパック対象外 --}}
                    {{-- アフターサポートパック加入日、検査項目初期化 --}}
                    initSelectAfterSupportJoinedDate();
                    initMaintenanceSurvey();
                    {{-- アフターサポートパック非対応の警告表示 --}}
                    $('div#equipment_type_not_supported').show();
                }
            }
        }

        {{-- SFA売上情報選択時の処理 --}}
        const funcSelectSale = function () {
            const targetSaleRowString = `div#sale div#row_${$(this).val()}`;
            const equipmentTypeId = $('select#equipment_type').val();
            const afterSupportStatus = $(`${targetSaleRowString} div.after_support_status input`).val();
            const supportPackJoinedAt = $(`${targetSaleRowString} div.after_support_joined_date`).text();
            changeEquipmentTypeOrSfaSaleImpl($(this).val(), equipmentTypeId, afterSupportStatus, supportPackJoinedAt);
            {{-- SFAクライアントコード --}}
            $('div#sfa_customer_id').text($(`${targetSaleRowString} div.sfa_customer_id`).text());
            {{-- 医院名 --}}
            $('div#sfa_clinic_name').text($(`${targetSaleRowString} div.sfa_clinic_name`).text());
            {{-- 電話番号 --}}
            $('div#phone_number').text($(`${targetSaleRowString} div.phone_number`).text());
            {{-- 郵便番号 --}}
            $('div#postal_code').text($(`${targetSaleRowString} div.postal_code`).text());
            {{-- 住所 --}}
            $('div#address').text($(`${targetSaleRowString} div.address`).text());
            {{-- 納入機器ID --}}
            $('div#supply_equipment_id').text($(`${targetSaleRowString} div.supply_equipment_id`).text());
            {{-- SFA商品分類 --}}
            $('div#sfa_product_category_name_sale').text($(`${targetSaleRowString} div.sfa_product_category`).text());
            {{-- 商品名 --}}
            $('div#product_name_sale').text($(`${targetSaleRowString} div.product_name`).text());
            {{-- 形式 --}}
            $('div#equipment_type_sale').text($(`${targetSaleRowString} div.equipment_type`).text());
            {{-- ロット・製番 --}}
            $('div#serial_number').text($(`${targetSaleRowString} div.serial_number`).text());
            {{-- 納品/売上日 --}}
            $('div#sales_date').text($(`${targetSaleRowString} div.sales_date`).text());
            {{-- アフターサポートパック加入ステータス文字列 --}}
            $('div#after_support_status span').text($(`${targetSaleRowString} div.after_support_status span`).text());
            {{-- アフターサポートパック加入ステータス --}}
            $('div#after_support_status input').val(afterSupportStatus);
            {{-- アフターサポートパック加入日 --}}
            $('div#after_support_joined_date').text(supportPackJoinedAt);

            $('input#sfa_sale_id').val($(this).val());
            $('div#row_sfa_clinic, div#row_sfa_sale').show();
            $('div#row_sfa_sale_no_relation').removeClass('d-flex').hide();
            $('#sale').modal('hide');
            return false;
        };

        $(function () {
            {{-- 初期表示設定 --}}
            {{-- 購入機器情報 - 機器押下不可 --}}
            $('select#equipment').prop('disabled', true);
            {{-- 購入機器情報 - 形式押下不可 --}}
            $('select#equipment_type').prop('disabled', true);
            {{-- 登録ボタン押下不可 --}}
            $('button#submit').prop('disabled', true);

            {{-- SFA売上選択時処理 --}}
            $('button.select_sale').click(funcSelectSale);

            {{-- 購入機器情報 - ジャンル選択変更時 --}}
            $('select#equipment_genre').change(function () {
                {{-- 購入機器情報 - ジャンル未選択変更時 --}}
                if ($('select#equipment_genre').val() == '') {
                    {{-- 購入機器情報 - 機器、形式をリセットして終了 --}}
                    $('select#equipment').empty();
                    $('select#equipment').prop('disabled', true);
                    $('select#equipment_type').empty();
                    $('select#equipment_type').prop('disabled', true);
                    return;
                }
                $.ajax({
                    url: "{{ route('productpromotion.admin.purchased-equipment.equipment', ['clinic_id' => $clinic->id]) }}",
                    type: "get",
                    headers: {
                        "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
                    },
                    data: {
                        equipmentGenreId: $('select#equipment_genre').val(),
                    },
                    dataType: "json"
                })
                .done((results) => {
                    $('select#equipment').prop('disabled', false);
                    $('select#equipment').empty();
                    $('select#equipment_type').prop('disabled', true);
                    $('select#equipment_type').empty();
                    $('select#equipment').append('<option></option>');
                    Object.keys(results).forEach((key) => {
                        $('select#equipment').append($('<option>').html(results[key]).val(key));
                    });
                })
                .fail((e) => {
                    console.log(e);
                });
            });

            {{-- 購入機器情報 - 機器選択変更時 --}}
            $('select#equipment').change(function () {
                {{-- 購入機器情報 - 機器未選択変更時 --}}
                if ($('select#equipment').val() == '') {
                    {{-- 購入機器情報 - 形式をリセットして終了 --}}
                    $('select#equipment_type').empty();
                    $('select#equipment_type').prop('disabled', true);
                    return;
                }
                $.ajax({
                    url: "{{ route('productpromotion.admin.purchased-equipment.equipmentType', ['clinic_id' => $clinic->id]) }}",
                    type: "get",
                    headers: {
                        "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
                    },
                    data: {
                        equipmentId: $('select#equipment').val(),
                    },
                    dataType: "json"
                })
                .done((results) => {
                    $('select#equipment_type').prop('disabled', false);
                    $('select#equipment_type').empty();
                    $('select#equipment_type').append('<option></option>');
                    results.forEach((element) => {
                        $('select#equipment_type').append($('<option>').html(element.external_name).val(element.key));
                    });
                })
                .fail((e) => {
                    console.log(e);
                });
            });

            {{-- 購入機器情報 - 形式選択変更時 --}}
            $('select#equipment_type').change(function () {
                const sfaSaleId = $('input#sfa_sale_id').val();
                const equipmentTypeId = $(this).val();
                const afterSupportStatus = $('div#after_support_status input').val();
                const supportPackJoinedAt = $('div#after_support_joined_date').text();
                changeEquipmentTypeOrSfaSaleImpl(sfaSaleId, equipmentTypeId, afterSupportStatus, supportPackJoinedAt);
            });

            {{-- SFA売上、商品情報選択内容変更時イベント処理 --}}
            $('#sale, #product').on('hidden.bs.modal', function (e) {
                if ($('input#sfa_sale_id').val() && $('input#sfa_product_id').val()) {
                    $('button#submit').prop('disabled', false);
                } else {
                    $('button#submit').prop('disabled', true);
                }
            });

            {{-- アフターサポートパック加入プラン変更時 --}}
            $('select#support_pack_sfa_product_id').change(function () {
                {{-- アフターサポートパック加入で対象方式の場合は強制選択 --}}
                {{-- アフターサポートパック未加入で対象方式選択中の場合はなしも含めた加入プランを選択可能 --}}
                const sfaProductId = $(this).val();
                if (sfaProductId) {
                    {{-- 加入プラン選択中なので設定しておく --}}
                    $('input#is_join_support_pack').val('1');
                    {{-- 加入プラン選択されたので加入日は必須 --}}
                    $('input#select_support_pack_joined_date').prop('required', true);
                } else {
                    {{-- 加入プランなし選択中 --}}
                    $('input#is_join_support_pack').val('0');
                    {{-- 加入プランなしなので加入日は任意 --}}
                    $('input#select_support_pack_joined_date').prop('required', false);
                }
            });

            {{-- 検査項目ボタン押下時処理 --}}
            $('button#btn_maintenance_survey').click(function () {
                let url = '{{ route('admin.WindowSelect.index', ['table' => 'MaintenanceSurvey']) }}';
                if ($('select#equipment').val()) {
                    url = url + '/' + $('select#equipment').val();
                }
                window.open(url , 'selectChild', 'width=500,height=800');
            });

            {{-- 関連付け登録時入力チェック --}}
            $('form#association').submit(function () {
                return true;
            });
        });
    </script>
    <script src="/js/search/ajaxForSfaProduct.js" type="module"></script>
    <script type="module">
        import AjaxForSfaProduct from '/js/search/ajaxForSfaProduct.js';
        const ajaxForSfaProduct = new AjaxForSfaProduct(function () {
            $('div#system_id').text($('div#product div#row_' + $(this).val() + ' div.system_id').text());
            $('div#sfa_category_name').text($('div#product div#row_' + $(this).val() + ' div.sfa_product_category_name').text());
            $('div#product_code').text($('div#product div#row_' + $(this).val() + ' div.product_code').text());
            $('div#product_name').text($('div#product div#row_' + $(this).val() + ' div.name').text());
            $('div#product_type').text($('div#product div#row_' + $(this).val() + ' div.product_type').text());
            $('input#sfa_product_id').val($(this).val());
            $('div#row_sfa_product').show();
            $('div#row_sfa_product_no_relation').removeClass('d-flex').hide();
            $('#product').modal('hide');
            return false;
        });
    </script>
    <script src="/js/search/ajaxForSfaSale.js" type="module"></script>
    <script type="module">
        import AjaxForSfaSale from '/js/search/ajaxForSfaSale.js';
        const ajaxForSfaSale = new AjaxForSfaSale(funcSelectSale, 'serial_number');
    </script>
@stop