{% extends 'admin/base_admin.html' %}

{% block content %}
<div class="page__header">
    <h1>{% if member %}회원 수정{% else %}회원 추가{% endif %}</h1>
    <a href="/admin/members" class="uk-button uk-button-default">
        <span uk-icon="icon: arrow-left"></span> 목록으로
    </a>
</div>

<div class="admin__form" style="max-width: 500px;">
    <form action="{% if member %}/admin/members/{{ member.mb_idx }}{% else %}/admin/members/add{% endif %}" method="post" class="uk-form-stacked">

        <div class="uk-margin">
            <label class="uk-form-label" for="mb_id">아이디</label>
            <div class="uk-form-controls">
                {% if member %}
                    <input class="uk-input" id="mb_id" type="text" value="{{ member.mb_id }}" disabled>
                    <p class="uk-text-muted uk-text-small uk-margin-small-top">아이디는 변경할 수 없습니다.</p>
                {% else %}
                    <input class="uk-input" id="mb_id" type="text" name="mb_id" placeholder="영문, 숫자 조합" required>
                {% endif %}
            </div>
        </div>

        <div class="uk-margin">
            <label class="uk-form-label" for="mb_name">이름</label>
            <div class="uk-form-controls">
                <input class="uk-input" id="mb_name" type="text" name="mb_name" value="{{ member.mb_name if member else '' }}" placeholder="회원 이름" required>
            </div>
        </div>

        {% if not member %}
        <div class="uk-margin">
            <label class="uk-form-label" for="password">비밀번호</label>
            <div class="uk-form-controls">
                <input class="uk-input" id="password" type="password" name="password" placeholder="4자 이상" required minlength="4">
            </div>
        </div>
        {% else %}
        <div class="uk-margin">
            <label class="uk-form-label">비밀번호</label>
            <div class="uk-form-controls">
                <button type="button" class="uk-button uk-button-secondary" onclick="resetPassword({{ member.mb_idx }})">
                    <span uk-icon="icon: lock"></span> 비밀번호 재설정
                </button>
            </div>
        </div>
        {% endif %}

        <hr class="uk-margin-medium">

        <div class="uk-margin">
            <button type="submit" class="uk-button uk-button-primary uk-button-large">
                <span uk-icon="icon: check"></span> {% if member %}수정{% else %}추가{% endif %}
            </button>
            <a href="/admin/members" class="uk-button uk-button-default uk-button-large">취소</a>
        </div>
    </form>
</div>
{% endblock %}

{% block scripts %}
{% if member %}
<script>
function resetPassword(mb_idx) {
    Swal.fire({
        title: '새 비밀번호 입력',
        input: 'password',
        inputPlaceholder: '새 비밀번호를 입력하세요 (4자 이상)',
        showCancelButton: true,
        confirmButtonColor: '#901438',
        cancelButtonColor: '#6c757d',
        confirmButtonText: '변경',
        cancelButtonText: '취소',
        inputValidator: (value) => {
            if (!value) return '비밀번호를 입력해주세요';
            if (value.length < 4) return '비밀번호는 4자 이상이어야 합니다';
        }
    }).then((result) => {
        if (result.isConfirmed) {
            $.ajax({
                url: "/admin/members/" + mb_idx + "/reset-password",
                type: "POST",
                contentType: "application/json",
                data: JSON.stringify({password: result.value}),
                success: function(res) {
                    if (res.success) {
                        Swal.fire({
                            title: '완료',
                            text: res.message,
                            icon: 'success'
                        });
                    } else {
                        Swal.fire('오류', res.message, 'error');
                    }
                },
                error: function(xhr) {
                    var msg = xhr.responseJSON ? xhr.responseJSON.message : '비밀번호 변경 중 오류가 발생했습니다.';
                    Swal.fire('오류', msg, 'error');
                }
            });
        }
    });
}
</script>
{% endif %}
{% endblock %}