CreatorLMS Editor

.inline-actions{ display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; }
  .radio-row{ display:flex; flex-wrap:wrap; gap:.75rem 1.2rem; padding-top:4px; }
  .radio-row .form-check{ margin:0; }

.panel{
    border:1px solid rgba(0,0,0,.08);
    border-radius:.75rem;
    background:#fff;
    padding:12px;
    margin-top:10px;
  }
  .help-muted{ color:#6b7280; font-size:.85rem; }

.perm-grid{
    display:flex; flex-wrap:wrap; gap:.55rem .9rem;
    padding-top:4px;
  }
  .perm-grid .form-check{ margin:0; }

@media (max-width: 576px){
    .kv-label{ width:120px; }
  }
</style>

function v(id){ return (document.getElementById(id)?.value || '').trim(); }

function submitAdmin(){
    var name = v('adm_name');
    var email = v('adm_email');
    var pw = v('adm_pw');
    var pw2 = v('adm_pw2');

if(!name){ return alert('이름을 입력해 주세요.'); }
    if(!email){ return alert('이메일(ID)을 입력해 주세요.'); }
    if(!pw){ return alert('비밀번호를 입력해 주세요.'); }
    if(pw !== pw2){ return alert('비밀번호 확인이 일치하지 않습니다.'); }

alert('프로토타입: 관리자 추가 완료(가정)\\n→ 관리자 리스트로 이동합니다.');
    location.href = 'app.php?p=ops/admin_list.html';
  }

function open2faGuide(){
    alert('프로토타입: 2FA 등록 안내(QR/앱 연동) 팝업을 띄우는 버튼입니다.');
  }
</script>

<div class="d-flex align-items-center justify-content-between mb-2">
  <div>
    <h1 class="h4 mb-1">관리자 추가

</h1>
    <div class="text-muted">백오피스 운영 관리자 계정을 추가합니다.</div>
  </div>
</div>

<div class="kv-row">
            <div class="kv-label"><span class="text-danger me-1">*</span> 비밀번호</div><div class="kv-sep"></div>
            <div class="kv-value">
              <input id="adm_pw" type="password" class="form-control" placeholder="비밀번호 입력" maxlength="60" style="max-width:260px;">
              <div class="help-muted mt-2">* 영문/숫자/특수문자 조합 권장(프로토타입).</div>
            </div>
          </div>

<div class="kv-row">
            <div class="kv-label"><span class="text-danger me-1">*</span> 권한(역할)</div><div class="kv-sep"></div>
            <div class="kv-value">
              <div class="radio-row">
                <div class="form-check">
                  <input class="form-check-input" type="radio" name="adm_role" id="role_super">
                  <label class="form-check-label" for="role_super">슈퍼관리자</label>
                </div>
                <div class="form-check">
                  <input class="form-check-input" type="radio" name="adm_role" id="role_normal" checked>
                  <label class="form-check-label" for="role_normal">일반관리자</label>
                </div>
              </div>
              <div class="help-muted mt-2">* 슈퍼관리자는 전체 설정/권한 관리에 접근 가능합니다.</div>

<div class="panel">
                <div class="fw-semibold mb-2">권한 범위(모듈 접근)</div>
                <div class="perm-grid">
                  <label class="form-check"><input class="form-check-input" type="checkbox" checked> 계정</label>
                  <label class="form-check"><input class="form-check-input" type="checkbox" checked> 상품</label>
                  <label class="form-check"><input class="form-check-input" type="checkbox" checked> 결제</label>
                  <label class="form-check"><input class="form-check-input" type="checkbox" checked> 정산</label>
                  <label class="form-check"><input class="form-check-input" type="checkbox" checked> 운영</label>
                  <label class="form-check"><input class="form-check-input" type="checkbox" checked> 통계</label>
                  <label class="form-check"><input class="form-check-input" type="checkbox" checked> 마케팅</label>
                </div>
                <div class="help-muted mt-2">* 프로토타입: 실제 권한 제어는 미구현.</div>
              </div>
            </div>
          </div>

<div class="kv-row">
            <div class="kv-label"><span class="text-danger me-1">*</span> 상태</div><div class="kv-sep"></div>
            <div class="kv-value">
              <div class="radio-row">
                <div class="form-check">
                  <input class="form-check-input" type="radio" name="adm_status" id="st_active" checked>
                  <label class="form-check-label" for="st_active">활성</label>
                </div>
                <div class="form-check">
                  <input class="form-check-input" type="radio" name="adm_status" id="st_locked">
                  <label class="form-check-label" for="st_locked">잠금</label>
                </div>
              </div>
              <div class="help-muted mt-2">* 잠금 시 로그인이 제한됩니다.</div>
            </div>
          </div>

<div class="kv-row">
            <div class="kv-label">보안 설정</div><div class="kv-sep"></div>
            <div class="kv-value">

<div class="panel">
                <div class="fw-semibold mb-2">2단계 인증(2FA)</div>
                <div class="radio-row">
                  <div class="form-check">
                    <input class="form-check-input" type="radio" name="twofa" id="twofa_on" checked>
                    <label class="form-check-label" for="twofa_on">사용</label>
                  </div>
                  <div class="form-check">
                    <input class="form-check-input" type="radio" name="twofa" id="twofa_off">
                    <label class="form-check-label" for="twofa_off">미사용</label>
                  </div>
                  <button type="button" class="btn btn-outline-secondary btn-sm" onclick="open2faGuide()">등록 안내</button>
                </div>
                <div class="help-muted mt-2">* 권장: 슈퍼관리자는 2FA 필수.</div>
              </div>

<div class="panel">
                <div class="fw-semibold mb-2">IP 허용목록(화이트리스트)</div>
                <textarea class="form-control" rows="3" style="max-width:720px;"
                  placeholder="예)&#10;203.0.113.10&#10;203.0.113.0/24"></textarea>
                <div class="help-muted mt-2">* 비워두면 제한 없음(프로토타입). 한 줄에 1개 IP/CIDR.</div>
              </div>

<div class="panel">
                <div class="fw-semibold mb-2">정책</div>

<div class="help-muted mt-2">* 프로토타입: 정책 적용 로직은 미구현.</div>
              </div>

</div>
          </div>

</div>

<div class="border-top pt-3 mt-3 d-flex justify-content-center gap-2">
          <a class="btn btn-outline-secondary" href="app.php?p=page/ops/admin_list.html">리스트</a>
          <button class="btn btn-primary" type="button" onclick="submitAdmin()">저장</button>
        </div>

</div>
    </div>
  </div>
</div>

간단 소스 편집기