@extends('layouts.app')

@section('content')
    <div class="container">
        <div class="row justify-content-center">
            <div class="">
                {{ Breadcrumbs::render('amendment.fluctuation.confirm',$app->application_id) }}
                <div class="shadow card">
                    <div class="shadow-sm card-header fs-3">労保連労働災害保険契約内容異動届(異動)確認画面</div>
                    <form id="entryForm" method="POST" action="{{ route('amendment.fluctuation.store',$app->application_id) }}" onsubmit="return false;">
                        @csrf
                        <div class="card-body">
                            @php
                                $LIN = explode('-', $app->LINumber);
                                $postcode = explode('-', $ins->post_code);
                                $tels = explode('-', $ins->tel);
                                $ad = $ins->address1 . $ins->address2;
                                $input = session('c_input', []);
                            @endphp
                            @if (session('status'))
                                <div class="alert alert-success" role="alert">
                                    {{ session('status') }}
                                </div>
                            @endif
                            <ul>
                                @foreach ($errors->all() as $error)
                                    <li class="fs-6 text-danger">{{ $error }}</li>
                                @endforeach
                            </ul>
                            <div class="fs-5 mb-3 red text-center text-danger">この内容で登録します。よろしいでしょうか？</div>
                            <div class="shadow-sm input-group mb-3">
                                <span class="input-group-text bg-secondary-subtle fs-5">労働保険番号</span>
                                <div class="form-floating">
                                    <span class="form-control fs-5 bg-gray">{{ $LIN[0] }}</span>
                                    <label for="floatingInput1">府県</label>
                                </div>
                                <div class="form-floating" style="width: 70px;flex: none;">
                                    <span class="form-control fs-5 bg-gray">*</span>
                                    <label for="floatingInput2">所掌</label>
                                </div>
                                <div class="form-floating" style="width: 70px;flex: none;">
                                    <span class="form-control fs-5 bg-gray">**</span>
                                    <label for="floatingInput3">管轄</label>
                                </div>
                                <div class="form-floating col-2">
                                    <span class="form-control fs-5 bg-gray">{{ $LIN[1] }}</span>
                                    <label for="floatingInput4">基幹番号</label>
                                </div>
                                <div class="form-floating">
                                    <span class="form-control fs-5 bg-gray">{{ $LIN[2] }}</span>
                                    <label for="floatingInput5">枝番号</label>
                                </div>
                                <div class="form-floating" style="width: 70px;flex: none;">
                                    <span class="form-control fs-5 bg-gray">{{ $LIN[3] }}</span>
                                    <label for="floatingInput6">追番</label>
                                </div>
                            </div>
                            <div class="shadow-sm input-group mb-3">
                                <span class="input-group-text bg-secondary-subtle fs-5">事業場の名称</span>
                                    <span class="form-control fs-5 bg-gray">{{ $ins->workspace }}</span>
                            </div>
                            <div class="d-flex">
                                <div class="col-6">
                                    <div class="shadow-sm input-group mb-3">
                                        <span class="input-group-text bg-secondary-subtle fs-5">事業主の氏名</span>
                                    <span class="form-control fs-5 bg-gray">{{ $ins->name }}</span>
                                    </div>
                                </div>
                            </div>
                            <div class="d-flex">
                                <div class="col-4">
                                    <div class="shadow-sm input-group mb-3">
                                        <span class="input-group-text bg-secondary-subtle fs-5">郵便番号</span>
                                        <span class="form-control fs-5 bg-gray">{{ $postcode[0] }}</span>
                                        <span class="input-group-text bg-secondary-subtle">―</span>
                                        <span class="form-control fs-5 bg-gray">{{ $postcode[1] }}</span>
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="shadow-sm input-group mb-3 ms-1">
                                        <span class="input-group-text bg-secondary-subtle fs-5">電話番号</span>
                                        <span class="form-control fs-5 bg-gray">{{ $tels[0] }}</span>
                                        <span class="input-group-text bg-secondary-subtle">―</span>
                                        <span class="form-control fs-5 bg-gray">{{ $tels[1] }}</span>
                                        <span class="input-group-text bg-secondary-subtle">―</span>
                                        <span class="form-control fs-5 bg-gray">{{ $tels[2] }}</span>
                                    </div>
                                </div>
                            </div>
                            <div class="shadow-sm input-group mb-3">
                                <span class="input-group-text bg-secondary-subtle fs-5">事業場の所在地</span>
                                <span class="form-control fs-5 bg-gray">{{ $ad }}</span>
                            </div>
                            <div class="d-flex">
                                <div class="col-4">
                                    <div class="shadow-sm input-group mb-3">
                                        <span class="input-group-text bg-secondary-subtle fs-5">異動日</span>
                                        <input type="date" value="{{ $input['date'] }}" id="date" name="date" class="form-control fs-5" disabled>
                                    </div>
                                </div>
                            </div>
                            <div class="shadow-sm input-group mb-3">
                                <span class="input-group-text bg-secondary-subtle fs-5">事業コード</span>
                                <select id="code" name="code"
                                    class="form-control fs-5"
                                    onchange="inputChange()" disabled>
                                    <option value="" {{ $input['code'] == '' ? 'selected' : '' }}>変更なし</option>
                                    <option value="02" {{ $input['code'] == '02' ? 'selected' : '' }}>02</option>
                                    <option value="03" {{ $input['code'] == '03' ? 'selected' : '' }}>03</option>
                                    <option value="11" {{ $input['code'] == '11' ? 'selected' : '' }}>11</option>
                                    <option value="12" {{ $input['code'] == '12' ? 'selected' : '' }}>12</option>
                                    <option value="21" {{ $input['code'] == '21' ? 'selected' : '' }}>21</option>
                                    <option value="23" {{ $input['code'] == '23' ? 'selected' : '' }}>23</option>
                                    <option value="24" {{ $input['code'] == '24' ? 'selected' : '' }}>24</option>
                                    <option value="25" {{ $input['code'] == '25' ? 'selected' : '' }}>25</option>
                                    <option value="26" {{ $input['code'] == '26' ? 'selected' : '' }}>26</option>
                                    <option value="31" {{ $input['code'] == '31' ? 'selected' : '' }}>31</option>
                                    <option value="32" {{ $input['code'] == '32' ? 'selected' : '' }}>32</option>
                                    <option value="33" {{ $input['code'] == '33' ? 'selected' : '' }}>33</option>
                                    <option value="34" {{ $input['code'] == '34' ? 'selected' : '' }}>34</option>
                                    <option value="35" {{ $input['code'] == '35' ? 'selected' : '' }}>35</option>
                                    <option value="36" {{ $input['code'] == '36' ? 'selected' : '' }}>36</option>
                                    <option value="37" {{ $input['code'] == '37' ? 'selected' : '' }}>37</option>
                                    <option value="38" {{ $input['code'] == '38' ? 'selected' : '' }}>38</option>
                                    <option value="41" {{ $input['code'] == '41' ? 'selected' : '' }}>41</option>
                                    <option value="42" {{ $input['code'] == '42' ? 'selected' : '' }}>42</option>
                                    <option value="44" {{ $input['code'] == '44' ? 'selected' : '' }}>44</option>
                                    <option value="45" {{ $input['code'] == '45' ? 'selected' : '' }}>45</option>
                                    <option value="46" {{ $input['code'] == '46' ? 'selected' : '' }}>46</option>
                                    <option value="47" {{ $input['code'] == '47' ? 'selected' : '' }}>47</option>
                                    <option value="48" {{ $input['code'] == '48' ? 'selected' : '' }}>48</option>
                                    <option value="49" {{ $input['code'] == '49' ? 'selected' : '' }}>49</option>
                                    <option value="50" {{ $input['code'] == '50' ? 'selected' : '' }}>50</option>
                                    <option value="51" {{ $input['code'] == '51' ? 'selected' : '' }}>51</option>
                                    <option value="52" {{ $input['code'] == '52' ? 'selected' : '' }}>52</option>
                                    <option value="53" {{ $input['code'] == '53' ? 'selected' : '' }}>53</option>
                                    <option value="54" {{ $input['code'] == '54' ? 'selected' : '' }}>54</option>
                                    <option value="55" {{ $input['code'] == '55' ? 'selected' : '' }}>55</option>
                                    <option value="56" {{ $input['code'] == '56' ? 'selected' : '' }}>56</option>
                                    <option value="57" {{ $input['code'] == '57' ? 'selected' : '' }}>57</option>
                                    <option value="58" {{ $input['code'] == '58' ? 'selected' : '' }}>58</option>
                                    <option value="59" {{ $input['code'] == '59' ? 'selected' : '' }}>59</option>
                                    <option value="60" {{ $input['code'] == '60' ? 'selected' : '' }}>60</option>
                                    <option value="61" {{ $input['code'] == '61' ? 'selected' : '' }}>61</option>
                                    <option value="62" {{ $input['code'] == '62' ? 'selected' : '' }}>62</option>
                                    <option value="63" {{ $input['code'] == '63' ? 'selected' : '' }}>63</option>
                                    <option value="64" {{ $input['code'] == '64' ? 'selected' : '' }}>64</option>
                                    <option value="66" {{ $input['code'] == '66' ? 'selected' : '' }}>66</option>
                                    <option value="71" {{ $input['code'] == '71' ? 'selected' : '' }}>71</option>
                                    <option value="72" {{ $input['code'] == '72' ? 'selected' : '' }}>72</option>
                                    <option value="73" {{ $input['code'] == '73' ? 'selected' : '' }}>73</option>
                                    <option value="74" {{ $input['code'] == '74' ? 'selected' : '' }}>74</option>
                                    <option value="81" {{ $input['code'] == '81' ? 'selected' : '' }}>81</option>
                                    <option value="90" {{ $input['code'] == '90' ? 'selected' : '' }}>90</option>
                                    <option value="91" {{ $input['code'] == '91' ? 'selected' : '' }}>91</option>
                                    <option value="93" {{ $input['code'] == '93' ? 'selected' : '' }}>93</option>
                                    <option value="94" {{ $input['code'] == '94' ? 'selected' : '' }}>94</option>
                                    <option value="95" {{ $input['code'] == '95' ? 'selected' : '' }}>95</option>
                                    <option value="96" {{ $input['code'] == '96' ? 'selected' : '' }}>96</option>
                                    <option value="97" {{ $input['code'] == '97' ? 'selected' : '' }}>97</option>
                                    <option value="98" {{ $input['code'] == '98' ? 'selected' : '' }}>98</option>
                                    <option value="99" {{ $input['code'] == '99' ? 'selected' : '' }}>99</option>
                                </select>
                                <span class="input-group-text col-9 bg-secondary-subtle fs-5" id="code_label">未選択</span>
                            </div>
                            <div class="d-flex">
                                <div class="col-12">
                                    <div class="shadow-sm input-group mb-3">
                                        <span class="input-group-text bg-secondary-subtle fs-5">賃金総額の変更</span>
                                        <select id="pwa_flg" name="pwa_flg" class="form-control fs-5" onchange="kChange()" disabled>
                                            <option value="0" {{ $input['pwa_flg'] == 0 ? 'selected' : '' }}>変更なし</option>
                                            <option value="50" {{ $input['pwa_flg'] == 50 ? 'selected' : '' }}>現保険契約の賃金総額に比べ100分の50以下の変動が見込まれる場合</option>
                                            <option value="200" {{ $input['pwa_flg'] == 200 ? 'selected' : '' }}>現保険契約の賃金総額に比べ100分の200以上の変動が見込まれる場合</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div id="pwa-area" class="d-none">
                                <div class="d-flex">
                                    <div class="shadow-sm input-group mb-3 ms-1">
                                        <span class="input-group-text col-5 bg-secondary-subtle fs-5">現保険契約の賃金総額</span>
                                        <span class="input-group-text col-5 fs-5 bg-gray">{{$ads->pcb_wt_amount}}</span>
                                        <span class="input-group-text col-2 bg-secondary-subtle fs-5">千円</span>
                                    </div>
                                    <div class="shadow-sm input-group mb-3 ms-1">
                                        <span class="input-group-text bg-secondary-subtle fs-5">変動後の賃金総額</span>
                                        <input type="number" value="{{ $input['pwa'] }}" id="pwa" name="pwa" class="form-control fs-5" disabled>
                                        <span class="input-group-text bg-secondary-subtle fs-5">千円</span>
                                    </div>
                                </div>
                            </div>
                            <div class="col-8 m-auto">
                                <span class="input-group-text bg-secondary-subtle fs-5 mb-3">特別加入者の変更</span>
                                <table class="table" id="sepsTable">
                                    <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">0:変更なし/1:加入/2:脱退</th>
                                            <th class="border-start d-none" scope="col">保険料算定基礎額</th>
                                        </tr>
                                    </thead>
                                    <tbody class="table-group-divider">
                                    @php
                                        $sepsData = json_decode(session('c_input.seps_json'), true) ?? [];
                                    @endphp
                                    @foreach($sepsData as $sep)
                                        <tr>
                                            <td class="{{ $sep['status_flag'] == 2 ? 'bg-secondary-subtle' :  ($sep['status_flag'] == 1 ? 'bg-danger-subtle' : '')}}" >{{ $sep['no'] }}</td>
                                            <td class="{{ $sep['status_flag'] == 2 ? 'bg-secondary-subtle' :  ($sep['status_flag'] == 1 ? 'bg-danger-subtle' : '')}}" >{{ $sep['name'] }}</td>
                                            <td class="{{ $sep['status_flag'] == 2 ? 'bg-secondary-subtle' :  ($sep['status_flag'] == 1 ? 'bg-danger-subtle' : '')}}" >{{ number_format($sep['value']) }}</td>
                                            <td class="{{ $sep['status_flag'] == 2 ? 'bg-secondary-subtle' :  ($sep['status_flag'] == 1 ? 'bg-danger-subtle' : '')}}" >{{ $sep['start_date'] }}</td>
                                            <td class="{{ $sep['status_flag'] == 2 ? 'bg-secondary-subtle' :  ($sep['status_flag'] == 1 ? 'bg-danger-subtle' : '')}}" >{{ $sep['end_date'] }}</td>
                                            <td class="{{ $sep['status_flag'] == 2 ? 'bg-secondary-subtle' :  ($sep['status_flag'] == 1 ? 'bg-danger-subtle' : '')}}" >{{ $sep['status_flag'] }}</td>
                                            <td class="d-none {{ $sep['status_flag'] == 2 ? 'bg-secondary-subtle' :  ($sep['status_flag'] == 1 ? 'bg-danger-subtle' : '')}} border-start">{{ number_format(365 * $sep['value']) }}</td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>

                            <div class="d-flex">
                                <button onclick="history.back();" class="fs-5 btn btn-secondary shadow-sm">入力画面に戻る</button>
                                <button type="submit" class="fs-5 btn btn-secondary shadow-sm"  onClick="submitAfterValidate();"
                                    style="margin:auto 0px auto auto">登録する</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <style>
        label:has(input[type="radio"]:checked) {
            background: #86b7fe;
        }
        .form-control:disabled{
          background-color: unset;
        }
        .non:disabled{
          background-color: var(--bs-secondary-bg);
        }
        .form-check-input:disabled,.form-check-input[disabled]~.form-check-label, .form-check-input:disabled~.form-check-label{
          opacity:1;
        }
        span.bg-gray{
            background-color: var(--bs-secondary-bg);
        }
    </style>
        <script>
        const ary = [
            @foreach ($ind as $i)
                {
                    industry_id: '{{ sprintf('%02d', $i->industry_id) }}',
                    name: '{{ $i->name }}',
                },
            @endforeach
        ];
        const pwa_flg = document.getElementById('pwa_flg');
        const ra = document.getElementById('pwa-area');
        if (pwa_flg.value != 0) {
            ra.classList.add('d-block');
            ra.classList.remove('d-none');
        } else {
            ra.classList.add('d-none');
            ra.classList.remove('d-block');
        }
        const code = document.getElementById('code');
        const label = document.getElementById('code_label');
        const items = ary.find(v => v.industry_id === code.value);
        label.innerHTML = items ? items.name : '未選択';

        function submitAfterValidate() {
            const form = document.getElementById('entryForm');
            if (!form.reportValidity()) {
                return false;
            } else {
                form.submit();
            }
        }
    </script>
@endsection