@extends('layouts.app')
<style>
    input.form-control,
    select.form-control,
    textarea.form-control {
        color: #222 !important;
    }
</style>
@section('content')
<main>
    <header class="alert alert-success">
        <h4 class="container">ユーザー情報確認 > ユーザー情報を変更する</h4>
    </header>
    <section class="container mt30 mb50">
        {{-- サーバーサイドエラー表示 --}}
        @if ($errors->any())
        <div class="alert alert-danger alert-dismissible" id="formErrorAreaPhp">
            <ul>
                @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
        @endif
        {{-- クライアントサイド用エラー表示領域 --}}
        <div class="alert alert-danger alert-dismissible" id="formErrorAreaJs" style="display:none;">
            <button type="button" class="close" onclick="this.parentNode.style.display='none';" aria-hidden="true">×</button>
            <h4 style="left: 0">入力内容に不備があります。</h4>
            <div id="formErrorMessagesJs"></div>
        </div>
        <form class="row form" action="{{ route('user.edit.post') }}" method="post" enctype="multipart/form-data" autocomplete="off">
            @csrf
            {{-- お名前（編集不可） --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_name">お名前</label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <input type="text" class="form-control" id="user_name" name="user_name" value="{{ old('user_name', $user->user_name) }}" readonly>
            </div>
            {{-- フリガナ（編集不可） --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_phonetic">フリガナ</label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <input type="text" class="form-control" id="user_phonetic" name="user_phonetic" value="{{ old('user_phonetic', $user->user_phonetic) }}" readonly>
            </div>
            {{-- 性別（値が空またはnullの場合は非表示） --}}
            @if (!empty($user->user_gender))
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_gender">性別</label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <select class="form-control" id="user_gender" name="user_gender">
                    <option value="">選択してください</option>
                    <option value="男性" {{ old('user_gender', $user->user_gender) == '男性' ? 'selected' : '' }}>男性</option>
                    <option value="女性" {{ old('user_gender', $user->user_gender) == '女性' ? 'selected' : '' }}>女性</option>
                </select>
            </div>
            @endif
            {{-- 居住所 --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_regident_zip">居住所</label>
            </div>
            <div class="col-12 col-lg-6 mb10 h-adr">
                <input type="text" class="form-control d-inline-block" style="width:120px; @if(!$is_update_period)background:#eee;@endif" name="user_regident_zip_1" maxlength="3" value="{{ old('user_regident_zip_1', substr($user->user_regident_zip,0,3)) }}" @if(!$is_update_period)readonly @endif> -
                <input type="text" class="form-control d-inline-block" style="width:140px; @if(!$is_update_period)background:#eee;@endif" name="user_regident_zip_2" maxlength="4" value="{{ old('user_regident_zip_2', substr($user->user_regident_zip,3,4)) }}" @if(!$is_update_period)readonly @endif><br>
                <select class="form-control d-inline-block" style="margin-top:8px; width:180px; @if(!$is_update_period)background:#eee;@endif" name="user_regident_pre" @if(!$is_update_period)disabled @endif>
                    <option value="">都道府県</option>
                    <option value="北海道" {{ old('user_regident_pre', $user->user_regident_pre) == '北海道' ? 'selected' : '' }}>北海道</option>
                    <option value="青森県" {{ old('user_regident_pre', $user->user_regident_pre) == '青森県' ? 'selected' : '' }}>青森県</option>
                    <option value="岩手県" {{ old('user_regident_pre', $user->user_regident_pre) == '岩手県' ? 'selected' : '' }}>岩手県</option>
                    <option value="宮城県" {{ old('user_regident_pre', $user->user_regident_pre) == '宮城県' ? 'selected' : '' }}>宮城県</option>
                    <option value="秋田県" {{ old('user_regident_pre', $user->user_regident_pre) == '秋田県' ? 'selected' : '' }}>秋田県</option>
                    <option value="山形県" {{ old('user_regident_pre', $user->user_regident_pre) == '山形県' ? 'selected' : '' }}>山形県</option>
                    <option value="福島県" {{ old('user_regident_pre', $user->user_regident_pre) == '福島県' ? 'selected' : '' }}>福島県</option>
                    <option value="茨城県" {{ old('user_regident_pre', $user->user_regident_pre) == '茨城県' ? 'selected' : '' }}>茨城県</option>
                    <option value="栃木県" {{ old('user_regident_pre', $user->user_regident_pre) == '栃木県' ? 'selected' : '' }}>栃木県</option>
                    <option value="群馬県" {{ old('user_regident_pre', $user->user_regident_pre) == '群馬県' ? 'selected' : '' }}>群馬県</option>
                    <option value="埼玉県" {{ old('user_regident_pre', $user->user_regident_pre) == '埼玉県' ? 'selected' : '' }}>埼玉県</option>
                    <option value="千葉県" {{ old('user_regident_pre', $user->user_regident_pre) == '千葉県' ? 'selected' : '' }}>千葉県</option>
                    <option value="東京都" {{ old('user_regident_pre', $user->user_regident_pre) == '東京都' ? 'selected' : '' }}>東京都</option>
                    <option value="神奈川県" {{ old('user_regident_pre', $user->user_regident_pre) == '神奈川県' ? 'selected' : '' }}>神奈川県</option>
                    <option value="新潟県" {{ old('user_regident_pre', $user->user_regident_pre) == '新潟県' ? 'selected' : '' }}>新潟県</option>
                    <option value="富山県" {{ old('user_regident_pre', $user->user_regident_pre) == '富山県' ? 'selected' : '' }}>富山県</option>
                    <option value="石川県" {{ old('user_regident_pre', $user->user_regident_pre) == '石川県' ? 'selected' : '' }}>石川県</option>
                    <option value="福井県" {{ old('user_regident_pre', $user->user_regident_pre) == '福井県' ? 'selected' : '' }}>福井県</option>
                    <option value="山梨県" {{ old('user_regident_pre', $user->user_regident_pre) == '山梨県' ? 'selected' : '' }}>山梨県</option>
                    <option value="長野県" {{ old('user_regident_pre', $user->user_regident_pre) == '長野県' ? 'selected' : '' }}>長野県</option>
                    <option value="岐阜県" {{ old('user_regident_pre', $user->user_regident_pre) == '岐阜県' ? 'selected' : '' }}>岐阜県</option>
                    <option value="静岡県" {{ old('user_regident_pre', $user->user_regident_pre) == '静岡県' ? 'selected' : '' }}>静岡県</option>
                    <option value="愛知県" {{ old('user_regident_pre', $user->user_regident_pre) == '愛知県' ? 'selected' : '' }}>愛知県</option>
                    <option value="三重県" {{ old('user_regident_pre', $user->user_regident_pre) == '三重県' ? 'selected' : '' }}>三重県</option>
                    <option value="滋賀県" {{ old('user_regident_pre', $user->user_regident_pre) == '滋賀県' ? 'selected' : '' }}>滋賀県</option>
                    <option value="京都府" {{ old('user_regident_pre', $user->user_regident_pre) == '京都府' ? 'selected' : '' }}>京都府</option>
                    <option value="大阪府" {{ old('user_regident_pre', $user->user_regident_pre) == '大阪府' ? 'selected' : '' }}>大阪府</option>
                    <option value="兵庫県" {{ old('user_regident_pre', $user->user_regident_pre) == '兵庫県' ? 'selected' : '' }}>兵庫県</option>
                    <option value="奈良県" {{ old('user_regident_pre', $user->user_regident_pre) == '奈良県' ? 'selected' : '' }}>奈良県</option>
                    <option value="和歌山県" {{ old('user_regident_pre', $user->user_regident_pre) == '和歌山県' ? 'selected' : '' }}>和歌山県</option>
                    <option value="鳥取県" {{ old('user_regident_pre', $user->user_regident_pre) == '鳥取県' ? 'selected' : '' }}>鳥取県</option>
                    <option value="島根県" {{ old('user_regident_pre', $user->user_regident_pre) == '島根県' ? 'selected' : '' }}>島根県</option>
                    <option value="岡山県" {{ old('user_regident_pre', $user->user_regident_pre) == '岡山県' ? 'selected' : '' }}>岡山県</option>
                    <option value="広島県" {{ old('user_regident_pre', $user->user_regident_pre) == '広島県' ? 'selected' : '' }}>広島県</option>
                    <option value="山口県" {{ old('user_regident_pre', $user->user_regident_pre) == '山口県' ? 'selected' : '' }}>山口県</option>
                    <option value="徳島県" {{ old('user_regident_pre', $user->user_regident_pre) == '徳島県' ? 'selected' : '' }}>徳島県</option>
                    <option value="香川県" {{ old('user_regident_pre', $user->user_regident_pre) == '香川県' ? 'selected' : '' }}>香川県</option>
                    <option value="愛媛県" {{ old('user_regident_pre', $user->user_regident_pre) == '愛媛県' ? 'selected' : '' }}>愛媛県</option>
                    <option value="高知県" {{ old('user_regident_pre', $user->user_regident_pre) == '高知県' ? 'selected' : '' }}>高知県</option>
                    <option value="福岡県" {{ old('user_regident_pre', $user->user_regident_pre) == '福岡県' ? 'selected' : '' }}>福岡県</option>
                    <option value="佐賀県" {{ old('user_regident_pre', $user->user_regident_pre) == '佐賀県' ? 'selected' : '' }}>佐賀県</option>
                    <option value="長崎県" {{ old('user_regident_pre', $user->user_regident_pre) == '長崎県' ? 'selected' : '' }}>長崎県</option>
                    <option value="熊本県" {{ old('user_regident_pre', $user->user_regident_pre) == '熊本県' ? 'selected' : '' }}>熊本県</option>
                    <option value="大分県" {{ old('user_regident_pre', $user->user_regident_pre) == '大分県' ? 'selected' : '' }}>大分県</option>
                    <option value="宮崎県" {{ old('user_regident_pre', $user->user_regident_pre) == '宮崎県' ? 'selected' : '' }}>宮崎県</option>
                    <option value="鹿児島県" {{ old('user_regident_pre', $user->user_regident_pre) == '鹿児島県' ? 'selected' : '' }}>鹿児島県</option>
                    <option value="沖縄県" {{ old('user_regident_pre', $user->user_regident_pre) == '沖縄県' ? 'selected' : '' }}>沖縄県</option>
                </select><br>
                <input type="text" class="form-control d-inline-block" style="margin-top:8px; @if(!$is_update_period)background:#eee;@endif" name="user_regident_city" value="{{ old('user_regident_city', $user->user_regident_city) }}" placeholder="足立区" @if(!$is_update_period)readonly @endif><br>
                <input type="text" class="form-control d-inline-block" style="margin-top:8px; @if(!$is_update_period)background:#eee;@endif" name="user_regident_add" value="{{ old('user_regident_add', $user->user_regident_add) }}" placeholder="六町1-1-1" @if(!$is_update_period)readonly @endif>
            </div>
            {{-- 生年月日 --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_birthdate">生年月日</label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <input type="date" class="form-control" id="user_birthdate" name="user_birthdate" value="{{ old('user_birthdate', $user->user_birthdate) }}" @if(!$is_update_period)readonly style="background:#eee;" @endif>
            </div>
            {{-- 年齢（自動計算 かつ 表示のみ） --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_age">年齢</label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <input type="number" class="form-control" id="user_age" name="user_age" value="{{ old('user_age', $user->user_age) }}" readonly>
            </div>
            {{-- 自宅電話番号 --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_homephone">自宅電話番号</label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <input type="text" class="form-control" name="user_homephone[]" value="{{ old('user_homephone.0', $user->user_homephone[0] ?? '') }}" style="width:80px; display:inline-block;">
                -
                <input type="text" class="form-control" name="user_homephone[]" value="{{ old('user_homephone.1', $user->user_homephone[1] ?? '') }}" style="width:80px; display:inline-block;">
                -
                <input type="text" class="form-control" name="user_homephone[]" value="{{ old('user_homephone.2', $user->user_homephone[2] ?? '') }}" style="width:80px; display:inline-block;">
            </div>
            {{-- 携帯電話番号 --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_mobile">携帯電話番号</label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <input type="text" class="form-control" name="user_mobile[]" value="{{ old('user_mobile.0', $user->user_mobile[0] ?? '') }}" style="width:80px; display:inline-block;">
                -
                <input type="text" class="form-control" name="user_mobile[]" value="{{ old('user_mobile.1', $user->user_mobile[1] ?? '') }}" style="width:80px; display:inline-block;">
                -
                <input type="text" class="form-control" name="user_mobile[]" value="{{ old('user_mobile.2', $user->user_mobile[2] ?? '') }}" style="width:80px; display:inline-block;">
            </div>
            {{-- メールアドレス --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_primemail">メールアドレス <span style="color:red;">*</span></label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <input type="email" class="form-control" id="user_primemail" name="user_primemail" value="{{ old('user_primemail', $user->user_primemail) }}" placeholder="name@example.com">
            </div>
            {{-- メールアドレス確認 --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_primemail_confirmation">メールアドレスの確認 <span style="color:red;">*</span></label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <input type="email" class="form-control" id="user_primemail2" name="user_primemail_confirmation" value="{{ old('user_primemail_confirmation') }}" placeholder="name@example.com">
            </div>
            {{-- 予備メールアドレス --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_submail">予備メールアドレス</label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <input type="email" class="form-control" id="user_submail" name="user_submail" value="{{ old('user_submail', $user->user_submail) }}" placeholder="name.sub@example.com">
            </div>
            {{-- 利用者区分 --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2 d-flex align-items-center">
                <label>利用者区分</label>
                <button type="button" id="userTypeInfoBtn" style="margin-left:2px; border:none; background:none; cursor:pointer; vertical-align:top; position:relative; top:-4px;">
                    <span style="display:inline-block; width:24px; height:24px; border-radius:50%; border:2px solid #007bff; text-align:center; line-height:20px; font-weight:bold; color:#007bff; font-size:16px; background:#fff;">？</span>
                </button>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <div class="form-check form-check-inline">
                    <input class="form-check-input" type="radio" name="user_category" id="user_categoryid_ippan" value="一般" {{ old('user_category', $user_category) == '一般' ? 'checked' : '' }} @if(!$is_update_period)disabled @endif>
                    <label class="form-check-label" for="user_categoryid_ippan">一般</label>
                </div>
                <div class="form-check form-check-inline">
                    <input class="form-check-input" type="radio" name="user_category" id="user_categoryid_gakusei" value="学生" {{ old('user_category', $user_category) == '学生' ? 'checked' : '' }} @if(!$is_update_period)disabled @endif>
                    <label class="form-check-label" for="user_categoryid_gakusei">学生</label>
                </div>
            </div>
            {{-- 勤務先名（一般のみ表示） --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2 user_workplace_area {{ old('user_category', $user_category) == '学生' ? 'd-none' : '' }}">
                <label for="user_workplace">勤務先名</label>
            </div>
            <div class="col-12 col-lg-6 mb10 user_workplace_area {{ old('user_category', $user_category) == '学生' ? 'd-none' : '' }}">
                <input type="text" class="form-control" id="user_workplace" name="user_workplace" value="{{ old('user_workplace', $user->user_workplace) }}" @if(!$is_update_period)readonly style="background:#eee;" @endif placeholder="マルバツ株式会社">
            </div>
            {{-- 学校名（学生のみ表示） --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2 user_school_area {{ old('user_category', $user_category) == '学生' ? '' : 'd-none' }}">
                <label for="user_school">学校名<span style="color:red;">*</span></label>
            </div>
            <div class="col-12 col-lg-6 mb10 user_school_area {{ old('user_category', $user_category) == '学生' ? '' : 'd-none' }}">
                <input type="text" class="form-control" id="user_school" name="user_school" value="{{ old('user_school', $user->user_school) }}" @if(!$is_update_period)readonly style="background:#eee;" @endif>
            </div>
            {{-- 卒業予定（学生のみ表示） --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2 user_graduate_area {{ old('user_category', $user_category) == '学生' ? '' : 'd-none' }}">
                <label for="user_graduate">卒業予定<span style="color:red;">*</span></label>
            </div>
            <div class="col-12 col-lg-6 mb10 user_graduate_area {{ old('user_category', $user_category) == '学生' ? '' : 'd-none' }}">
                <input type="date" class="form-control" id="user_graduate" name="user_graduate" value="{{ old('user_graduate', $user->user_graduate) }}" @if(!$is_update_period)readonly style="background:#eee;" @endif>
            </div>
            {{-- 住所（関連） --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_relate">住所</label>
            </div>
            <div class="col-12 col-lg-6 mb10 h-adr">
                <input type="text" class="form-control d-inline-block" style="width:80px; @if(!$is_update_period)background:#eee;@endif" name="user_relate_zip_1" maxlength="3" value="{{ old('user_relate_zip_1', substr($user->user_relate_zip,0,3)) }}" @if(!$is_update_period)readonly @endif> -
                <input type="text" class="form-control d-inline-block" style="width:100px; @if(!$is_update_period)background:#eee;@endif" name="user_relate_zip_2" maxlength="4" value="{{ old('user_relate_zip_2', substr($user->user_relate_zip,3,4)) }}" @if(!$is_update_period)readonly @endif><br>
                <select class="form-control d-inline-block" style="margin-top:8px; width:180px; @if(!$is_update_period)background:#eee;@endif" name="user_relate_pre" @if(!$is_update_period)disabled @endif>
                    <option value="">都道府県</option>
                    <option value="北海道" {{ old('user_relate_pre', $user->user_relate_pre) == '北海道' ? 'selected' : '' }}>北海道</option>
                    <option value="青森県" {{ old('user_relate_pre', $user->user_relate_pre) == '青森県' ? 'selected' : '' }}>青森県</option>
                    <option value="岩手県" {{ old('user_relate_pre', $user->user_relate_pre) == '岩手県' ? 'selected' : '' }}>岩手県</option>
                    <option value="宮城県" {{ old('user_relate_pre', $user->user_relate_pre) == '宮城県' ? 'selected' : '' }}>宮城県</option>
                    <option value="秋田県" {{ old('user_relate_pre', $user->user_relate_pre) == '秋田県' ? 'selected' : '' }}>秋田県</option>
                    <option value="山形県" {{ old('user_relate_pre', $user->user_relate_pre) == '山形県' ? 'selected' : '' }}>山形県</option>
                    <option value="福島県" {{ old('user_relate_pre', $user->user_relate_pre) == '福島県' ? 'selected' : '' }}>福島県</option>
                    <option value="茨城県" {{ old('user_relate_pre', $user->user_relate_pre) == '茨城県' ? 'selected' : '' }}>茨城県</option>
                    <option value="栃木県" {{ old('user_relate_pre', $user->user_relate_pre) == '栃木県' ? 'selected' : '' }}>栃木県</option>
                    <option value="群馬県" {{ old('user_relate_pre', $user->user_relate_pre) == '群馬県' ? 'selected' : '' }}>群馬県</option>
                    <option value="埼玉県" {{ old('user_relate_pre', $user->user_relate_pre) == '埼玉県' ? 'selected' : '' }}>埼玉県</option>
                    <option value="千葉県" {{ old('user_relate_pre', $user->user_relate_pre) == '千葉県' ? 'selected' : '' }}>千葉県</option>
                    <option value="東京都" {{ old('user_relate_pre', $user->user_relate_pre) == '東京都' ? 'selected' : '' }}>東京都</option>
                    <option value="神奈川県" {{ old('user_relate_pre', $user->user_relate_pre) == '神奈川県' ? 'selected' : '' }}>神奈川県</option>
                    <option value="新潟県" {{ old('user_relate_pre', $user->user_relate_pre) == '新潟県' ? 'selected' : '' }}>新潟県</option>
                    <option value="富山県" {{ old('user_relate_pre', $user->user_relate_pre) == '富山県' ? 'selected' : '' }}>富山県</option>
                    <option value="石川県" {{ old('user_relate_pre', $user->user_relate_pre) == '石川県' ? 'selected' : '' }}>石川県</option>
                    <option value="福井県" {{ old('user_relate_pre', $user->user_relate_pre) == '福井県' ? 'selected' : '' }}>福井県</option>
                    <option value="山梨県" {{ old('user_relate_pre', $user->user_relate_pre) == '山梨県' ? 'selected' : '' }}>山梨県</option>
                    <option value="長野県" {{ old('user_relate_pre', $user->user_relate_pre) == '長野県' ? 'selected' : '' }}>長野県</option>
                    <option value="岐阜県" {{ old('user_relate_pre', $user->user_relate_pre) == '岐阜県' ? 'selected' : '' }}>岐阜県</option>
                    <option value="静岡県" {{ old('user_relate_pre', $user->user_relate_pre) == '静岡県' ? 'selected' : '' }}>静岡県</option>
                    <option value="愛知県" {{ old('user_relate_pre', $user->user_relate_pre) == '愛知県' ? 'selected' : '' }}>愛知県</option>
                    <option value="三重県" {{ old('user_relate_pre', $user->user_relate_pre) == '三重県' ? 'selected' : '' }}>三重県</option>
                    <option value="滋賀県" {{ old('user_relate_pre', $user->user_relate_pre) == '滋賀県' ? 'selected' : '' }}>滋賀県</option>
                    <option value="京都府" {{ old('user_relate_pre', $user->user_relate_pre) == '京都府' ? 'selected' : '' }}>京都府</option>
                    <option value="大阪府" {{ old('user_relate_pre', $user->user_relate_pre) == '大阪府' ? 'selected' : '' }}>大阪府</option>
                    <option value="兵庫県" {{ old('user_relate_pre', $user->user_relate_pre) == '兵庫県' ? 'selected' : '' }}>兵庫県</option>
                    <option value="奈良県" {{ old('user_relate_pre', $user->user_relate_pre) == '奈良県' ? 'selected' : '' }}>奈良県</option>
                    <option value="和歌山県" {{ old('user_relate_pre', $user->user_relate_pre) == '和歌山県' ? 'selected' : '' }}>和歌山県</option>
                    <option value="鳥取県" {{ old('user_relate_pre', $user->user_relate_pre) == '鳥取県' ? 'selected' : '' }}>鳥取県</option>
                    <option value="島根県" {{ old('user_relate_pre', $user->user_relate_pre) == '島根県' ? 'selected' : '' }}>島根県</option>
                    <option value="岡山県" {{ old('user_relate_pre', $user->user_relate_pre) == '岡山県' ? 'selected' : '' }}>岡山県</option>
                    <option value="広島県" {{ old('user_relate_pre', $user->user_relate_pre) == '広島県' ? 'selected' : '' }}>広島県</option>
                    <option value="山口県" {{ old('user_relate_pre', $user->user_relate_pre) == '山口県' ? 'selected' : '' }}>山口県</option>
                    <option value="徳島県" {{ old('user_relate_pre', $user->user_relate_pre) == '徳島県' ? 'selected' : '' }}>徳島県</option>
                    <option value="香川県" {{ old('user_relate_pre', $user->user_relate_pre) == '香川県' ? 'selected' : '' }}>香川県</option>
                    <option value="愛媛県" {{ old('user_relate_pre', $user->user_relate_pre) == '愛媛県' ? 'selected' : '' }}>愛媛県</option>
                    <option value="高知県" {{ old('user_relate_pre', $user->user_relate_pre) == '高知県' ? 'selected' : '' }}>高知県</option>
                    <option value="福岡県" {{ old('user_relate_pre', $user->user_relate_pre) == '福岡県' ? 'selected' : '' }}>福岡県</option>
                    <option value="佐賀県" {{ old('user_relate_pre', $user->user_relate_pre) == '佐賀県' ? 'selected' : '' }}>佐賀県</option>
                    <option value="長崎県" {{ old('user_relate_pre', $user->user_relate_pre) == '長崎県' ? 'selected' : '' }}>長崎県</option>
                    <option value="熊本県" {{ old('user_relate_pre', $user->user_relate_pre) == '熊本県' ? 'selected' : '' }}>熊本県</option>
                    <option value="大分県" {{ old('user_relate_pre', $user->user_relate_pre) == '大分県' ? 'selected' : '' }}>大分県</option>
                    <option value="宮崎県" {{ old('user_relate_pre', $user->user_relate_pre) == '宮崎県' ? 'selected' : '' }}>宮崎県</option>
                    <option value="鹿児島県" {{ old('user_relate_pre', $user->user_relate_pre) == '鹿児島県' ? 'selected' : '' }}>鹿児島県</option>
                    <option value="沖縄県" {{ old('user_relate_pre', $user->user_relate_pre) == '沖縄県' ? 'selected' : '' }}>沖縄県</option>
                </select>
                <input type="text" class="form-control d-inline-block" style="margin-top:8px; @if(!$is_update_period)background:#eee;@endif" name="user_relate_city" value="{{ old('user_relate_city', $user->user_relate_city) }}" @if(!$is_update_period)readonly @endif placeholder="足立区">
                <input type="text" class="form-control d-inline-block" style="margin-top:8px; @if(!$is_update_period)background:#eee;@endif" name="user_relate_add" value="{{ old('user_relate_add', $user->user_relate_add) }}" @if(!$is_update_period)readonly @endif placeholder="六町1-1-1">
            </div>
            {{-- 本人確認書類 --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <a href="#" id="docDetailLink" style="color:#007bff; text-decoration:underline;">本人確認書類の詳細はこちら</a>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <span>おもて</span>
                <input type="file" id="photo_filename1" name="photo_filename1" accept="image/*" style="width:auto; display:inline-block;">
            </div>
            <div class="col-12 col-md-3 offset-0 offset-md-2"></div>
            <div class="col-12 col-lg-6 mb10">
                <span>ウ　ラ</span>
                <input type="file" id="photo_filename2" name="photo_filename2" accept="image/*" style="width:auto; display:inline-block;">
            </div>
            {{-- パスワード変更 --}}
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_pass_new">新しいパスワード</label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <input type="password" class="form-control" id="user_pass_new" name="user_pass_new" placeholder="8文字以上の半角英数字">
            </div>
            <div class="col-12 col-md-3 offset-0 offset-md-2">
                <label for="user_pass_confirm">パスワードの確認</label>
            </div>
            <div class="col-12 col-lg-6 mb10">
                <input type="password" class="form-control" id="user_pass_confirm" name="user_pass_confirm" placeholder="8文字以上の半角英数字">
            </div>
            {{-- 確認ボタン --}}
            <div class="col-12 col-md-5 offset-0 offset-md-1 mt10">
                <input type="submit" class="btn btn-lg btn-block btn-success" value="入力内容を確認する" />
            </div>
            <div class="col-12 col-md-5 mt10">
                <a class="btn btn-lg btn-block btn-outline-success" href="{{ route('mypage') }}">メニューへ戻る</a>
            </div>
        </form>
    </section>
    {{-- 本人確認書類説明モーダル --}}
    <div class="modal fade" id="docDetailModal" tabindex="-1" aria-labelledby="docDetailModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="docDetailModalLabel">下記のいずれかの写真をアップロードしてください。</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <ul>
                        <li>免許証・旅券（パスポート）・在留カード・特別永住者証明書</li>
                        <li>外国人登録証明書（特別永住者のみ）・学生証</li>
                        <li>身体障害者手帳・生活保護受給証・保険証</li>
                        <li>上記いずれかの住所記載のあるもの</li>
                    </ul>
                    <p style="font-size:14px; color:#555;">※特別永住者の方は特別永住者証明書と外国人登録証明書の両方が必要となります。</p>
                </div>
            </div>
        </div>
    </div>
    <script>
        document.getElementById('docDetailLink').addEventListener('click', function(e) {
            e.preventDefault();
            $('#docDetailModal').modal('show');
        });
    </script>
    {{-- 利用者区分説明モーダル --}}
    <div class="modal fade" id="userTypeInfoModal" tabindex="-1" aria-labelledby="userTypeInfoModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-body">
                    <div>
                        【一般】<br>
                        　学生以外の利用者の方<br>
                        【学生】<br>
                        　学生の利用者の方<br>
                        【減免】<br>
                        　以下に該当される利用者の方が、減免の対象になる場合があります。<br>
                        　（例）<br>
                        　　・高齢者の方<br>
                        　　・障がい者の方<br>
                        　　・生活保護を受けられている方<br>
                        　　・中国残留邦人の方<br>
                        　　・児童扶養手当を受給されている方<br>
                        　詳しくはサポートセンターまでお問い合わせください。<br>
                        　TEL：03-5856-4720
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">キャンセル</button>
                </div>
            </div>
        </div>
    </div>
</main>
<script>
    var isUpdatePeriod = <?php echo json_encode($is_update_period); ?>;
    document.querySelector('form').addEventListener('submit', function(e) {
        var errors = [];
        // メールアドレスチェック
        var email = document.getElementById('user_primemail').value.trim();
        var email2 = document.getElementById('user_primemail2').value.trim();
        var submail = document.getElementById('user_submail').value.trim();
        if (!email) {
            errors.push('「メールアドレス」は必須です。');
        }
        if (!email2) {
            errors.push('「メールアドレスの確認」は必須です。');
        }
        if (email && email2 && email !== email2) {
            errors.push('「メールアドレス」と「メールアドレスの確認」が一致しません。');
        }
        if (email && submail && email === submail) {
            errors.push('メールアドレスと予備メールアドレスに同じアドレスを入力できません。');
        }
        // 電話番号
        var homePhones = document.getElementsByName('user_homephone[]');
        var mobilePhones = document.getElementsByName('user_mobile[]');
        var homeFilled = false,
            mobileFilled = false;
        for (var i = 0; i < homePhones.length; i++) {
            if (homePhones[i].value.trim() !== '') homeFilled = true;
        }
        for (var i = 0; i < mobilePhones.length; i++) {
            if (mobilePhones[i].value.trim() !== '') mobileFilled = true;
        }
        if (!homeFilled && !mobileFilled) {
            errors.push('「自宅電話番号」と「携帯電話番号」のいずれかは入力してください。');
        }
        // 利用者区分が学生の場合のみ、学校名と卒業予定が必須（編集可能時のみ）
        var isStudent = document.getElementById('user_categoryid_gakusei').checked;
        if (isUpdatePeriod && isStudent) {
            var school = document.getElementById('user_school').value.trim();
            var graduate = document.getElementById('user_graduate').value.trim();
            if (!school) {
                errors.push('「学校名」は必須です。');
            }
            if (!graduate) {
                errors.push('「卒業予定」は必須です。');
            }
        }
        // パスワードバリデーション（8文字以上の半角英数字）
        var passNew = document.getElementById('user_pass_new').value;
        var passConfirm = document.getElementById('user_pass_confirm').value;
        if (passNew !== '') {
            if (!/^([a-zA-Z0-9]{8,})$/.test(passNew)) {
                errors.push('「新しいパスワード」は8文字以上の半角英数字で入力してください。');
            }
        }
        if (passNew !== '' && passConfirm !== '') {
            if (passNew !== passConfirm) {
                errors.push('「新しいパスワード」と「パスワードの確認」が一致しません。');
            }
        }
        if (errors.length > 0) {
            e.preventDefault();
            var areaJs = document.getElementById('formErrorAreaJs');
            var msgsJs = document.getElementById('formErrorMessagesJs');
            msgsJs.innerHTML = errors.join('<br>');
            areaJs.style.display = '';
            window.scrollTo({
                top: 0,
                behavior: 'smooth'
            });
        } else {
            // パスワード両方入力かつ一致時のみuser_passとして送信
            if (passNew !== '' && passConfirm !== '' && passNew === passConfirm) {
                var form = this;
                var hidden = document.createElement('input');
                hidden.type = 'hidden';
                hidden.name = 'user_pass';
                hidden.value = passNew;
                form.appendChild(hidden);
            }
        }
    });
    // 利用者区分による表示切替
    function toggleUserTypeFields() {
        var ippan = document.getElementById('user_categoryid_ippan').checked;
        var gakusei = document.getElementById('user_categoryid_gakusei').checked;
        var workplaceAreas = document.querySelectorAll('.user_workplace_area');
        var schoolAreas = document.querySelectorAll('.user_school_area');
        var graduateAreas = document.querySelectorAll('.user_graduate_area');
        if (ippan) {
            workplaceAreas.forEach(function(el) {
                el.classList.remove('d-none');
            });
            schoolAreas.forEach(function(el) {
                el.classList.add('d-none');
            });
            graduateAreas.forEach(function(el) {
                el.classList.add('d-none');
            });
        } else if (gakusei) {
            workplaceAreas.forEach(function(el) {
                el.classList.add('d-none');
            });
            schoolAreas.forEach(function(el) {
                el.classList.remove('d-none');
            });
            graduateAreas.forEach(function(el) {
                el.classList.remove('d-none');
            });
        } else {
            workplaceAreas.forEach(function(el) {
                el.classList.remove('d-none');
            });
            schoolAreas.forEach(function(el) {
                el.classList.add('d-none');
            });
            graduateAreas.forEach(function(el) {
                el.classList.add('d-none');
            });
        }
    }
    document.getElementById('user_categoryid_ippan').addEventListener('change', toggleUserTypeFields);
    document.getElementById('user_categoryid_gakusei').addEventListener('change', toggleUserTypeFields);
    window.addEventListener('DOMContentLoaded', function() {
        toggleUserTypeFields();
    });
    // 利用者区分説明ポップアップ表示
    document.getElementById('userTypeInfoBtn').addEventListener('click', function() {
        $('#userTypeInfoModal').modal('show');
    });

    // 生年月日入力時に年齢自動計算
    document.getElementById('user_birthdate').addEventListener('change', function() {
        var birth = this.value;
        var ageInput = document.getElementById('user_age');
        if (birth) {
            var today = new Date();
            var birthDate = new Date(birth);
            var age = today.getFullYear() - birthDate.getFullYear();
            var m = today.getMonth() - birthDate.getMonth();
            if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate())) {
                age--;
            }
            ageInput.value = age;
        } else {
            ageInput.value = '';
        }
    });
</script>
@endsection