@model bitforum.Models.Account.Member
@using bitforum.Constants
@{
    ViewData["Title"] = "회원 등록";
}

<div class="container">
    <h3>@ViewData["Title"]</h3>
    <hr />

    <partial name="_StatusMessage" />

    <form name="f_admin_write" id="fAdminWrite" method="post" accept-charset="utf-8" autocomplete="off" action="/Member/List/Create" enctype="multipart/form-data">
        <div class="row mb-2">
            <label for="GradeID" class="col-sm-2 col-form-label">회원등급</label>
            <div class="col-sm-10">
                <select id="GradeID" name="GradeID" class="form-select w-auto" asp-items="ViewBag.MemberGrades">
                    <option value="">등급 선택</option>
                </select>
                <span asp-validation-for="GradeID" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="Email" class="col-sm-2 col-form-label"><span>*</span> 이메일</label>
            <div class="col-sm-10">
                <input type="email" asp-for="Email" class="form-control" required maxlength="60" placeholder="중복 시 등록이 불가합니다. 60자 이내" />
                <span asp-validation-for="Email" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="Name" class="col-sm-2 col-form-label"><span>*</span> 별명</label>
            <div class="col-sm-10">
                <input type="text" asp-for="Name" class="form-control" required maxlength="20" placeholder="중복 시 등록이 불가합니다. 20자 이내" />
                <span asp-validation-for="Name" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="Password" class="col-sm-2 col-form-label"><span>*</span> 비밀번호</label>
            <div class="col-sm-10">
                <input type="password" asp-for="Password" class="form-control" required minlength="4" />
                <span asp-validation-for="Password" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="RePassword" class="col-sm-2 col-form-label"><span>*</span> 비밀번호 확인</label>
            <div class="col-sm-10">
                <input type="password" name="RePassword" id="RePassword" class="form-control" required minlength="4" />
            </div>
        </div>
        <hr/>
        <div class="row mb-2">
            <label for="FirstName" class="col-sm-2 col-form-label">성</label>
            <div class="col-sm-10">
                <input type="text" asp-for="FirstName" class="form-control" maxlength="20" placeholder="최대 20자" />
                <span asp-validation-for="FirstName" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="LastName" class="col-sm-2 col-form-label">이름</label>
            <div class="col-sm-10">
                <input type="text" asp-for="LastName" class="form-control" maxlength="40" placeholder="최대 40자" />
                <span asp-validation-for="LastName" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="Intro" class="col-sm-2">자기소개</label>
            <div class="col-sm-10">
                <textarea asp-for="Intro" class="form-control" placeholder="최대 1000자" rows="2" maxlength="1000"></textarea>
                <span asp-validation-for="Intro" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="Summary" class="col-sm-2">한마디</label>
            <div class="col-sm-10">
                <input type="text" asp-for="Summary" class="form-control" maxlength="50" placeholder="50자 이내"/>
                <span asp-validation-for="Summary" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="Phone" class="col-sm-2">연락처</label>
            <div class="col-sm-10">
                <input type="text" asp-for="Phone" class="form-control" maxlength="15" placeholder="010-0000-0000 형식으로 입력하세요." pattern="010-\d{4}-\d{4}" />
                <span asp-validation-for="Phone" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="Gender" class="col-sm-2 col-form-label">성별</label>
            <div class="col-sm-10 align-content-center">
                <div class="form-check-inline">
                    <input type="radio" asp-for="Gender" id="male" class="form-check-input" value="@Gender.Male" />
                    <label class="form-check-label" for="male">남자</label>
                </div>
                <div class="form-check-inline">
                    <input type="radio" asp-for="Gender" id="female" class="form-check-input" value="@Gender.Female" />
                    <label class="form-check-label" for="female">여자</label>
                </div>
                <span asp-validation-for="Gender" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="Birthday" class="col-sm-2">생년월일</label>
            <div class="col-sm-10">
                <input type="date" asp-for="Birthday" class="form-control w-auto" />
                <span asp-validation-for="Birthday" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="Photo" class="col-sm-2 col-form-label">사진</label>
            <div class="col-sm-10">
                <div id="photoPrev" hidden><img class="img-fluid img-thumbnail" alt="사진 미리보기" /></div>
                <input type="file" asp-for="Photo" class="form-control" accept="image/*" />
                <span asp-validation-for="Photo" class="text-danger"></span>
            </div>
        </div>
        <div class="row mb-2">
            <label for="Icon" class="col-sm-2 col-form-label">아이콘</label>
            <div class="col-sm-10">
                <div id="iconPrev" hidden><img class="img-fluid img-thumbnail" alt="아이콘 미리보기" /></div>
                <input type="file" asp-for="Icon" class="form-control" accept="image/*" />
                <span asp-validation-for="Icon" class="text-danger"></span>
            </div>
        </div>
        <hr/>
        <div class="row mb-2">
            <label for="IsEmailVerified" class="col-sm-2 col-form-label">이메일 인증</label>
            <div class="col-sm-10 align-content-center">
                <div class="form-check-inline">
                    <input type="checkbox" asp-for="IsEmailVerified" class="form-check-input" />
                    <label class="form-check-label" for="IsEmailVerified">인증 했습니다.</label>
                    <span asp-validation-for="IsEmailVerified" class="text-danger"></span>
                </div>
            </div>
        </div>
        <div class="row mb-2">
            <label for="IsAuthCertified" class="col-sm-2 col-form-label">본인 인증</label>
            <div class="col-sm-10 align-content-center">
                <div class="form-check-inline">
                    <input type="checkbox" asp-for="IsAuthCertified" class="form-check-input" />
                    <label class="form-check-label" for="IsAuthCertified">인증 했습니다.</label>
                    <span asp-validation-for="IsAuthCertified" class="text-danger"></span>
                </div>
            </div>
        </div>
        <div class="row mb-2">
            <label for="IsDenied" class="col-sm-2 col-form-label">차단 여부</label>
            <div class="col-sm-10 align-content-center">
                <div class="form-check-inline">
                    <input type="checkbox" asp-for="IsDenied" class="form-check-input" />
                    <label class="form-check-label" for="IsDenied">차단합니다.</label>
                    <span asp-validation-for="IsDenied" class="text-danger"></span>
                </div>
            </div>
        </div>
        <div class="row mb-2">
            <label for="IsAdmin" class="col-sm-2 col-form-label">관리자 여부</label>
            <div class="col-sm-10 align-content-center">
                <div class="form-check-inline">
                    <input type="checkbox" asp-for="IsAdmin" class="form-check-input" />
                    <label class="form-check-label" for="IsAdmin">관리자입니다.</label>
                    <span asp-validation-for="IsAdmin" class="text-danger"></span>
                </div>
            </div>
        </div>
        <div class="row mb-2">
            <label for="IsWithdraw" class="col-sm-2 col-form-label">탈퇴 여부</label>
            <div class="col-sm-10 align-content-center">
                <div class="form-check-inline">
                    <input type="checkbox" asp-for="IsWithdraw" class="form-check-input" />
                    <label class="form-check-label" for="IsWithdraw">탈퇴했습니다.</label>
                    <span asp-validation-for="IsWithdraw" class="text-danger"></span>
                </div>
            </div>
        </div>
        <hr/>
        <div class="d-grid gap-2 text-center d-md-block">
            <button type="submit" class="btn btn-sm btn-success">저장</button>
            <a asp-action="Index" class="btn btn-sm btn-secondary">취소</a>
        </div>
        <br/>
    </form>
</div>

@section Scripts {
<script>
    setupImagePreview("Photo", "photoPrev");
    setupImagePreview("Icon", "iconPrev");

    $(document).on("submit", "#fAdminWrite", function(e) {
        e.preventDefault();
        const password = e.target.elements["Password"].value;
        const rePassword = e.target.elements["RePassword"].value;
        if (password !== rePassword) {
            alert("비밀번호가 일치하지 않습니다.");
            return false;
        }
        this.submit();
    });
</script>
}