UI Template Code Guide v0. 20240306~ v1. 20241202~

CBT 사용자 (일반) /_res/cbt/

공통·서브+메인 템플릿 (Layout)

1. _템플릿.공통·서브 :
   | tp.sub.php (로그인후) (부품스타일)
   
2. _템플릿.기타 :
   | tp.sub_layer1pop1.php (레이어팝업)
   | tp.sub_layer1pop2.php (자동 레이어팝업. 2025 ADsP 보상 패키지 받기 안내) 🟢
   | tp.sub_width1full1.php (전체폭배치)
   | 운영페이지 메인 작업중 (/sub/main/main_@m.php)
   | 502 Bad Gateway (html 단독) @m
   | 공사중 (html 단독)
   | 로딩중 (html 단독) | 로딩중1 | 로딩중2 @m 🟢
   
3. _운영페이지.코드전달용 : (html)
   | 문제풀기 세트 시험 목록 | 잠금
   
4. _테스트 :
   | test.html 🔷 | m01 | m02 | m03 | m04 | m05 | m06 | m07 | m08 | m09 | m10
   
5. 채널톡 테스트 20251105~
6. AI 튜터 🟢🟢 20260127~
   + 현재 대화 상단으로 이동
   + 이전 대화 내용 보기 버튼 위치, 문제 잠깐 보기 버튼 및 기능 추가
   | 운영 exam2view1.php
   | 운영 exam2view1_@m.php (운영코드 그대로 실험)
   | 운영 exam2view1_@m2.php (개발자모드 요소복사)
   | m01. 터치 드래그 새로고침 이슈 [Android.앱] 🟢
   | m02. 자판 있으면 스크롤 안됨 이슈 [삼성인터넷] 🟢
   

1. CSS Component (Sample Demo)
   

본문 템플릿 리뉴얼 ToBe. 20241202~

1. 메인(홈) /_res/cbt/html/main/ ✴️🟢 ️
   1. 메인(홈) 🟢🟢
      (( v11 (( v10 (토스트 팝업) 🟢🟢 (( v09 (( v08 (( v07 (팝업다수) (( v06 (팝업1개) (( v05 (( v04 (( v03 (( v02 (( v01
      )) m01 (토스트팝업 360*240)
      )) m02 (PC 배경 화면) (예비) 🔷
      )) m_pop2 (.cp1layer1pop2 데모)
      | 최근 본 강의 (섬네일만 다름)
      | 로그인전 🟢🟢 (( v01
      | 문제 추천 진입 시 도서인증을 안한 경우
      | 자동 레이어팝업. 2025 ADsP 보상 패키지 받기 안내 🟢
      + 홍보 배너 슬라이더
      + 지금 뜨는 글 슬라이더
      + 인기상품 슬라이더
      + 레어어팝업. 홍보 팝업
      + 토스트팝업
      
   2. 공통UI
      + 하단 내비게이션
      + 사이드바 (햄버거 메뉴 or 드로어 내비게이션)
      
2. 인트로(로그인..) /_res/cbt/html/intro/ (( 20250110~이후
   1. 런처스크린 🔷 (( m01
      
   2. 로그인 (( v01
   3. 비밀번호 변경 (비밀번호 찾기) 🔷
      | 메일전송 - 성공
      | 메일전송 - 실패
      
   4. 비밀번호 변경 메일 )) webmail
   5. 비밀번호 바꾸기 🔷
   6. 회원가입 (작성)
      + 순서 변경 및 구분선
      + 전체 동의
      
   7. QR 랜딩페이지 | 운영페이지 (다른 도메인)
      | 2초 후 자동 클릭 (( V01
      
   8. 잘못된 접근 (빈화면) 🟢🟢
      
3. 공부하기 /_res/cbt/html/study/
   1. 문제풀기 🟢🟢 (썸네일 제목 구성항목) (( v06 (( v05 (( v04 (( v03 (( v02 | m01 (.cp1layer1pop2 데모) (( v01
      | 로그인 전
      + 2차 내비게이션
      | 팝업 없는거
      | 팝업 1개
      | 팝업 여러개 (운영 코딩 전 여기서 작업)
      | a02. 무료 문제 (PT체험문제)
      | a03. 빅데이터분석기사 필기 2024
      | a04. ADsP 데이터분석 준전문가 2025 (최신개정)
      | a05. ADP 필기 기출문제 패키지
      | a05. ADP 필기 기출문제 패키지 + 잠금
      | a06. 경영정보시각화능력 필기 2025 PT (PREMIUM)
      | a07. ADsP 끝장 패키지 2025 PT
      | a08. ADsP 끝장 패키지 2025 PT (45회 기출분석) 20250618
      | a09. ADP 필기 기출문제 패키지 PT 20250618
      | a10. ADP 필기 올패키지 PT 20250618
      | a11. 2025 ADsP 보상 패키지 🟢
      | a11. 2025 ADsP 보상 패키지 + 잠금 🟢
      | a12. 나만의 문제집 추가 🟢🟢 (( v01
      | a13. 레이어팝업. ADsP 상품 세일 🔷🟢
      | a14. 레이어팝업. ADP 상품 세일 🔷🟢
      
      + (햄버거) 주메뉴 (사이드바)
      　- 리뉴얼 20241211
      　- 레이어팝업. 프로필 편집 (작성) : 닉네임 추가
      　- 레이어팝업. 로그아웃 확인
      + 레이어메뉴. 과목 이동 및 도서 추가
      + 레이어팝업. 슬라이더
      + 레이어팝업. 교재 인증번호 등록 - 탭(종이책 | 전자책), 랜덤번호
      
   2. 예상문제 (문제풀기) (시험 목록)
      | 문제를 푼 이력이 있을 경우 (레이어팝업. 초기화 안내)
      | (레이어팝업. 무단 복제 금지 안내) ❓
      | 잠금 + 무료 예상문제 표시 ADsP
      | 잠금 + 무료 예상문제 표시 ADP (과목 단위 공개)
      | 잠금 + 무료 예상문제 표시 ADP (장 단위 공개)
      | 잠금 + 로그인전 (레이어팝업. 로그인 유도)
      | 레이어팝업. 나만의 문제집 만들기 선택 (유저가 첫 150문제 풀었을 때) 🟢🟢
      
   3. 예상문제 - 문제 바로 풀기 (문제풀이) ✴️
      (( v11 (( m04 (( v10 (( v09 (( v08 (( v07 (( v06 (( v05 (( v04 (( v03 (( m02 (( v02 (( m01 (( v01
      )) m05 (동영상 유튜브 )) video H264 MP4) ⚫
      )) m06 (유튜브 바로 확인 + 재생 속도 옵션)
      | 이미지 뷰어 (핀치줌.드래그.더블클릭 확대축소.닫기) 🟢
      | [현재 창] | [새 창] | [새 창] window.open()
      | 문제와 선택지 둘다 짧은 경우
      | 문제와 선택지 둘다 긴 경우 | a02 | a01 | m01
      | 문제만 긴 경우
      | 선택지만 긴 경우
      | 선택지가 길어서 화면 벗어날 경우
      | 선택지가 이미지인 경우 ⚫
      | 레이어팝업. 나만의 문제집 만들기 선택 (유저가 첫 150문제 풀었을 때) 🟢🟢 (( v01 (토스트)
      | 레이어팝업. AI 튜터 베타 안내 (동의) 🟢🟢
      + 정답 오답 표시
      + 토스트 (정답 오답 안내)
      + 토스트 (해설 본 후 정답 수정 불가)
      + 해설 보기
      + 레이어팝업. 중단
      + 바텀시트 핸들바로 영역 확장/축소
      + 이전 다음 문제 이동 터치스와이프
      + 이미지 클릭 전체보기(확대/축소)
      + 비기봇에게 문의중…(로딩중) 2초 후 비기봇 해설 보여줌
      + 핵심쇼츠강의 --- (동영상플레이.자막)
      + 해시태그 나만 활성
      + 자막에서 해시태그 찾아서 마킹
      + 마킹 있는 자막만 보여줌
      + 첫번째 마킹 있는 자막 위치에서 동영상 재생
      + 레이어메뉴. 재생 속도 옵션
      
   4. 예상문제 - 문제 바로 풀기 - 코치마크
   5. 예상문제 - 문제 바로 풀기 - 화면 이동 (번호목록)
      
   6. 예상문제 - 문제 바로 풀기 - 테스트 결과 (( v02 (( v01
      
   7. 예상문제 - 해설 보며 공부하기 (( v01
      | 오답 100선 해설
      | 빈출 100선 해설
      
   8. 예상문제 - 해설 보며 공부하기 - 문제 이동 (번호 목록) (( v01
      
   9. 경영정보시각화능력 필기 2025 PT ~20250403
      1. 공부하기 (메인)
      2. 입문 모의고사 패키지 (시험 목록)
         | 강의 포함 (결제 완료)
         | 강의 미포함 (결제 완료)
         | 잠금 (미결제)
         + 구매 유도
         
      3. 문제 바로 풀기
         | 강의 미결제 (문제 풀이 강의 클릭하면 구매 유도)
         + 레이어팝업. 구매 유도
         
   ~~~
   
   10. 모의고사 (문제풀기) (시험 목록)
       | 문제를 푼 이력이 있을 경우 (레이어팝업. 초기화 안내)
       | 잠금 ADsP
       | 잠금 ADP
       
   11. 모의고사 - 문제 바로 풀기 (( v01
       | 나가기를 하지 않고 시험을 종료할 시 (레이어팝업. 확인) ❓
       + 타이머
       + 레이어팝업. 중단
       + 레이어팝업. 제출
       
   12. 모의고사 - 문제 바로 풀기 - 코치마크
   13. 모의고사 - 문제 바로 풀기 - 화면 이동 (번호 목록)
       
   14. 모의고사 - 문제 바로 풀기 - 테스트 결과 ))어디서링크?
       
   15. 모의고사 - 해설 보며 공부하기
       
   16. 모의고사 - 해설 보며 공부하기 - 문제 이동 (번호 목록)
       
   ~~~ (( 모의고사와 동일 )) ~~~
   
   17. 기출문제 (문제풀기) (시험 목록)
       | 문제를 푼 이력이 있을 경우 (레이어팝업. 초기화 안내)
   18. 기출문제 - 문제 바로 풀기
   19. 기출문제 - 문제 바로 풀기 - 코치마크
   20. 기출문제 - 문제 바로 풀기 - 화면 이동 (번호 목록)
       
   21. 기출문제 - 문제 바로 풀기 - 테스트 결과 ))어디서링크?
       
   22. 기출문제 - 해설 보며 공부하기
       
   23. 기출문제 - 해설 보며 공부하기 - 문제 이동 (번호 목록)
       
   ~~~
   
   24. 오답노트 (시험 목록) (( v01
       | 문제를 푼 이력이 있을 경우 (레이어팝업. 초기화 안내)
       | 오답노트/컨닝페이퍼 탭 내용 변경
       | 서브탭 스타일 변경 20250821
       | 시험지 비활성화 (일부 잠금) 🟢 20250905. 모바일 아니면 탭 모두 노출 (노스크롤)
       
   25. 오답노트 - 문제 바로 풀기
       ++ 예상문제와 동일
       + n3번 틀린 문제에요!
       + 오답 노트에서 제외하기
       ++ 뒤로가기 링크 변경, 결과보기 삭제 필요!
   26. 오답노트 - 문제 바로 풀기 - 화면 이동 (번호 목록)
   27. 오답노트 - 해설 보며 공부하기
   28. 오답노트 - 해설 보며 공부하기 - 문제 이동 (번호 목록)
   29. 컨닝페이퍼 (시험 목록) (( v01
       | 문제를 푼 이력이 있을 경우 (레이어팝업. 초기화 안내)
       | 시험지 비활성화 (일부 잠금) 🟢 20250905
       
   30. 컨닝페이퍼 - 문제 바로 풀기
       ++ 예상문제와 동일
       + n3번 틀린 문제에요!
       
   31. 컨닝페이퍼 - 문제 바로 풀기 - 화면 이동 (번호 목록)
   32. 컨닝페이퍼 - 해설 보며 공부하기
   33. 컨닝페이퍼 - 해설 보며 공부하기 - 문제 이동 (번호 목록)
   ~~ 20240405
   34. 나의 성적 (전체 시험) (( v01
   35. 나의 성적 (준비중)
       
   36. 나의 성적 - 빈 화면 (제출전) | no1.v01 | no2.v01
       | 전체 시험 | 5과목
       | 모의고사
       | 기출문제
       | 로그인전 (로그인 유도 버튼)
       
   37. 나의 성적 - 전체 시험 (3회 이상 제출)
       | 5과목
       + 탭 (총 점수 | 1과목 | 2과목 | 3과목 | 총 점수)
       + 차트::막대1+라인3
       + 엄지척 (별점)
       + 선택상자
       
   38. 나의 성적 - 모의고사 (3회 이상 제출) (( v01
       | 1회 제출 | 5과목 (( v01
       | 2회 제출 | 5과목
       
   39. 나의 성적 - 기출문제 (3회 이상 제출)
       기출문제 탭 활성, 기출문제 차트만 보임, 제출한 기출문제 목록 이외의 기능 동일
       
   40. 나의 성적 - 테스트 결과 (전체) (( v02 (평균) (( v01 (총점)
       | 5과목 | 4과목
       | 테스트 오답 결과 | 5과목
       
   41. 나의 성적 - 모의고사 리포트 (( v01
       | 5과목
       + 차트::막대1+라인3
       + 탭 (1과목 | 2과목 | 3과목)
       
   42. 나의 성적 - 모의고사 리포트 - 세부 리포트 (과목별 오답)
   43. 나만의 문제집 🟢🟢
       1. 상품 메인 - 나만의 문제집 추가 )) 공부하기(메인) 문제풀기
          
       2. 나만의 문제집 (빈화면)
          + 레이어팝업. 개념 선택하기
          | 잠금 🟢
          
       3. 나만의 문제집 (목록) 🟢🟢 (( v01
          | 잠금 🟢
          | 잠금 (샘플 오픈) 🟢
          | 샘플 맛보기 + 도서 인증 후 (빈화면) 🟢🟢
          + 레이어팝업. 개념 선택하기
          + 레이어팝업. 문제 배치 선택
          + 레이어팝업. 선택한 개념 확인
          | 아직 풀이 이력이 없어요.
          | 총 150 문제 미만 푼 경우
          | 추천 이후 1문제 이상 추가로 풀었을 경우 (토스트)
          | 추천 이후 문제풀이를 하지 않은 경우 (토스트)
          + 레이어메뉴. 이름 변경 / 삭제
          + 레이어팝업. 이름 변경
          + 레이어팝업. 삭제 확인
          
       4. 나만의 문제집 - 나만의 문제집 이용 방법 (동영상+자막) 🟢🟢
          
       5. 나만의 문제집 - 테스트 결과 🟢 (( v01
          
4. PT샵 /_res/cbt/html/shop/
   1. PT샵 (메인) | (( v02 (( m02 (( v01 (( m01
      | 판매할 상품 정보 적용. 20241211
      + 정렬 드롭다운
      + 탭 (PT이용권 | 도서 | 강의) - URI 해시값으로 탭 활성
      + 레이어팝업메뉴. 정렬 옵션 (모달 바텀 시트 or 드롭업)
      
   2. 상품 검색
      | 최근 검색어 있음 | 최근 검색어 없음 | 검색 결과 있음 | 검색 결과 없음
   3. 상품 상세 (( v01
      
      ▶ 세부정보 (개별 페이지 퍼블리싱)
      | [도서] ADsP 데이터분석 준전문가 2025 (1쇄)
      | [도서] ADsP 데이터분석 준전문가 2025 (2쇄)
      | [도서] 빅데이터분석기사 필기 2024
      | [도서] 빅데이터분석기사 실기 with Python
      | [도서] ADP 필기 올패키지
      | [이용권] 경영정보시각화능력 필기 모의고사 PT
      | [이용권] ADP 필기 올패키지 PT
      | [도서] 경영정보시각화능력 필기 2025
      | [도서] 경영정보시각화능력 실기 Tableau 2025
      | [도서] ADP 필기 올패키지 2026 개정판
      | [도서] 경영정보시각화능력 실기 Power BI 2026
      | [도서] ADsP 데이터분석 준전문가 2026 최신 개정판 🟢
      
      + 공유. 네이티브 기능 호출
      + 탭 (상세내용 | 상품정보)
      + 상세 내용 더보기/접기
      + 상세 내용 (이미지, 목차 아코디언, 저자소개, 배송관련)
      + 레이어팝업. 로그인 유도
      
   4. 임시 결제 (도서) | a01 | m02 | m01
      + 수량 증감
      + 체크팁
      + 폼 전송 시 필수 사항 미입력 요소에 초점, 브라우저 툴팁 커스텀
      
   5. 임시 결제 내역 | a01
      | 결제 내역 없음 (빈화면)
   6. 임시 주문 상세 (( v01
      
   7. 결제 완료
      
5. 커뮤니티 /_res/cbt/html/community/
   1. 게시글 목록
      | 시험후기 🟢🟢 (( v02 (( v01 | m01 (테스트)
      | 정보공유방
      | 자유게시판
      | 공지사항
      + 레이어메뉴. 정렬 옵션
      + 광고배너
      
   2. 게시글 상세 (( m01 (( v01
      | 시험후기. 로그인 상태, 닉네임 없는 경우
      | 미로그인
      | 닉네임 있는 경우
      | 내가 작성한 글이 아닌 경우, 부가메뉴 더보기는 보이지 않음
      + 공유. 네이티브 기능 호출
      + 레이어메뉴. 수정/삭제
      + 댓글
      + 댓글 등록
      + 토스트. 댓글 닉네임등록&해제
      
   3. 닉네임 입력
      + 오프너의 입력상자 값 변경
      
   4. 게시글 작성 (( v01
      | 시험후기 | 자유게시판
      + 선택상자(라디오드롭다운)
      + 토스트. 게시글 닉네임등록&해제
      + 사진 첨부
   5. 게시글 검색
      | 최근 검색어 있음 | 최근 검색어 없음 | 검색 결과 있음 | 검색 결과 없음
6. 마이PT /_res/cbt/html/my/ (학습관리)
   1. 마이PT - PT 이용권 (목록) (( v02 (( v01
      | PT 이용권 없음 (+ PT 콘텐츠) (( v03 (( v02 (( v01
      + 레이어팝업메뉴. 정렬 옵션 (모달 바텀 시트 or 드롭업)
      
   2. 마이PT - 강의 (이론정복강의) (( v02 (( v01
   3. 마이PT - 강의 - ADsP 절 강의 리스트 (( v01
      + 절 내부 아코디언
      
   4. 마이PT - 강의 - 상세 (동영상플레이.자막) 🟢🟢 (( v02 (( v01
      + 제목 말줄임 + 재생 속도
   5. 마이PT - 강의 - 상세 - 빈화면 🟢
      | 준비중 | 준비중 (상단 없이)
      | 강의가 없는 경우
      
   6. 유료 강의 리스트 🟢
      
   7. 유료 강의 플레이 (동영상플레이) 🟢
      + 타임라인, 커리큘럼 아코디언
      
7. 사용자 관련 /_res/cbt/html/user/
   1. 계정관리
   2. 개인정보 처리방침 (( v01
   3. 이용약관 (뒤로가기)
      | 이용약관 (닫기)
   4. 마케팅 활용 및 광고 수신 동의
   5. 탈퇴
   6. 탈퇴 완료
8. 문제 추천 /_res/cbt/html/recommend/
   1. 진입 경로 : 메인 배너와 팝업, 문제풀기 메뉴
   2. 개인정보 설문
      | 도서인증을 안한 경우 (( v01
      + 레이어팝업. 도서 미인증
      
   3. 레벨 확인 및 선택
   4. 문제 타입 선택 (( v01 (( m01
      + 레이어팝업. 레벨 변경
      
   5. 실전 트레이닝 - 문제 풀기
      | 레이어팝업. 시작 (처음, 중단 내역 없는 경우, 레벨 변경 후 (중단 내역 무관)
      | 레이어팝업. 시작 (이어서 풀기 / 새로 풀기) (중단 내역 있는 경우)
      | 레이어팝업. 이용 횟수 초과
      + 레이어팝업. 중단
      + 레이어팝업. 제출
      
   6. 실전 트레이닝 - 문제 선택
   7. 실전 트레이닝 - 테스트 결과 (( 제출 클릭
   8. 로드맵 - 문제 풀기
      | 레이어팝업. 시작
      | 레이어팝업. 이용 횟수 초과
      
   9. 로드맵 - 학습목표 선택
      + 탭 (1과목 | 2과목 | 3과목)
      
   10. 결과 분석
       + 탭 (1과목 | 2과목 | 3과목)
       + 레이어팝업메뉴. 정렬 옵션 (모달 바텀 시트 or 드롭업)
       
   11. 학습 전략
       | 이미지 뷰어 (새 창) (핀치줌.드래그.더블클릭 확대축소) | 기초 | 초급 | 중급 | 고급
       
9. 기타 /_res/cbt/html/etc/
   1. 기업 문의 | html
   2. PT 이용 신청서 (작성) | html
   3. 시험일 D-day (시험 일정 확인) 🟢🟢
      + 카운트다운
      

웹메일

1. 비밀번호 변경 요청 🔷

본문 템플릿 (Contents) AsIs. 20240306~ 20241126 (갱신중단) ▼

CBT 관리자 /_res/cbt.A/

공통·서브+메인 템플릿 (Layout)

1. _템플릿.공통·서브 :
   | tp.sub.php (관리자.로그인후) (부품스타일)
   
2. _테스트 :
   | MathJax.js
   | 활동 통계 (chart.js)
   | 교재 관리 - 순서 정렬 🟢
   
3. _운영 :
   | 로그인
   

1. CSS Component (Sample Demo)
   

본문 템플릿 (Contents)

최고 관리자 ~/html/sub/

20240603~ (( 화면설계서.Figma

1. 로그인 (작성)
2. 홈(대시보드) 🔷 ))기획?
3. 사용자 관리 (( v03 (( v02 (( v01
   + 레이어팝업. 사용자 추가/수정 (+ 교재 선택 추가)
   + 레이어팝업. 달력날짜선택
   + 전체,1,3,6,12개월 버튼
   
4. 자격증 관리 (( v01
   + 레이어팝업. 자격증 추가/수정 (+ 중복확인)
   + 성공(yes), 오류(no) 안내 글
   
5. 자격증 관리 - 태그 관리 - 학습목표 관리 (( v01
   + 레이어팝업. 태그 추가 (+ 과목/장/절/학습목표 선택 + 과목,장,절,학습목표 입력 추가)
   + 레이어팝업. 학습목표 수정
   
6. 자격증 관리 - 태그 관리 - 과목 관리 (( v01
   + 레이어팝업. 과목 수정
   + 레이어팝업. 태그 삭제 확인 (confirm)
   
7. 자격증 관리 - 태그 관리 - 장 관리 (( v01
   + 레이어팝업. 장 수정
   + 레이어팝업. 태그 삭제 확인 (confirm)
   
8. 자격증 관리 - 태그 관리 - 세부 절 관리 (( v01
   + 레이어팝업. 세부 절 수정
   + 레이어팝업. 태그 삭제 확인 (confirm)
   
9. 교재 관리 (( v01
   + 레이어팝업. 교재 추가/수정 (+ 중복확인)
   + 표지 사진 업로드. 미리보기
   + 레이어팝업. 교재 삭제 확인
   
10. 교재 관리 - 교재 수정 (폼+목록)
    + 표지 사진 업로드. 미리보기
    + 레이어팝업. 등록 시험지 수정
    
11. 시험 관리 (( v04 (( v03 (( v02 (( v01
    + 레이어팝업. 시험지 추가/수정 (+ 시험 유형 선택 + 교재 코드 선택 추가)
    + 레이어팝업. 시험문제 추가/수정 (+ 드래그 순서 정렬 + 추가)
    + 레이어팝업. 문제보기 (문제의 보기가 있는(없는) 경우)
    + 새로 추가된 수식 렌더링 ( LaTeX )) MathML )
12. 시험 관리 - 시험문제
    + 드래그 순서 정렬 + 추가
    + 레이어팝업. 문제보기 (문제의 보기가 있는(없는) 경우)
    + 표 thead 고정, tbody 스크롤
    
13. 문제 관리 (( v02 (( v01
    | 레이어팝업. 문제보기 (문제의 보기, 비기봇 해설, 핵심쇼츠강의 없는 경우)
    + 레이어팝업. 문제 추가/수정 (+ 문제 유형 선택 + 선택지 추가 + 정답 추가)
    + 레이어팝업. 문제보기 (문제의 보기가 있는(없는) 경우)
    + 레이어팝업. 문제 삭제 확인 (시험지에 배치된 경우) (시험지에 배치 안된 경우)
14. 공지사항
    + 레이어팝업. 임시저장 글
    
15. 공지사항 작성 (( m01 (( v01
    
16. 쿠폰 관리 ))기획?
    
17. 서술형 평가 Beta
    1. 문제 리스트
       
    2. 문제 입력 | html
       + 레이어팝업. 채점 기준
       + 레이어팝업. 문제 내용
       + 레이어팝업. 답안 입력
       
    3. 채점 검수 | html
       + 레이어팝업. 답안 비교
       + 레이어팝업. 채점 점수
       
18. 쇼츠 관리 🟢
19. 쇼츠 관리 - 쇼츠 검수 🟢
20. PT샵 관리 🟢 (( 교재 관리 복제
    + 레이어팝업. 상품 추가/수정 (+ 중복확인)
    + 대표 사진 업로드. 미리보기
    + 레이어팝업. 상품 삭제 확인
    + 레이어팝업. 순서 정렬 (운영페이지)
    + 레이어팝업. 상품 수정 (운영페이지)
    

강사용 관리자 ~/html/teacher/ 🟢

20241010~ (( 화면설계서.Figma

1. 강사 로그인 (작성)
   + 레이어팝업. 회원가입 완료 알림
   
2. 강사 회원가입 (작성)
   + 비밀번호. pattern, 확인, 자동생성
   + 약관 동의 확인 버튼 클릭 시 체크박스 선택
   + 레이어팝업. 이용약관
   + 레이어팝업. 개인정보 처리방침
   + 가입 진행 확인창, 뒤로가기 확인창
   + 레이어팝업. 인증 메일 발송 알림
   
3. 강사 회원가입 - 메일 인증 완료 안내
4. 홈(대시보드) - 수익 통계 (( m02 (( m01
   | 일간 : 시점 선택 안한 경우 (오늘 시점) (18일 이상)
   | 일간 : 시점 선택한 경우 (과거 시점) (18일 이상)
   | 일간 : 시점 선택 안한 경우 (오늘 시점) (18일 미만)
   | 일간 : 시점 선택한 경우 (과거 시점) (18일 미만)
   | 일간 : 초기 빈화면
   | 주간
   | 월간
   + 차트::막대+라인
   + 레이어팝업. 프로필 편집 (강사 프로필)
   
5. 홈(대시보드) - 수강생 분석 (( m01
   | 일간 | 주간 | 월간
   + 차트::막대+라인
   
6. 정산 관리 (목록)
   + 레이어팝업. 달력날짜선택
   + 전체,1,3,6,12개월 버튼 (디폴트값 1개월). input change 이벤트
   
7. 상품 관리 (목록)
   + 레이어팝업. 상품 추가 신청
   + 레이어팝업. 상품 추가 신청 접수 완료
   + 레이어팝업. 상품 삭제 요청 확인
   + 필수 입력 사항 누락 시 초점 (브라우저 제공 툴팁)
   
8. 수강생 관리 (목록)
   + 레이어팝업. 관리자 추가/수정 (상세)
   + 레이어팝업. 수강생 수정 (상세)
   
9. 수강생 관리 - 수강생 성적 리포트 (대시보드) (( m01
   + 프로그레스바:: 도넛, 막대
   + 차트:: 막대+라인(+슬라이더), 도넛(파이), 막대
   + 스크롤 표 헤더 스티키
   + 레이어팝업. 최근 3회 시험 상세 리포트
   
10. 수강생 관리 - 테스트 결과
11. 자격증 관리
    + 태그 관리 링크 페이지 (최고 관리자와 동일)
    
12. 자격증 관리 - 태그 관리 - 학습목표 관리 (최고 관리자와 동일)
13. 자격증 관리 - 태그 관리 - 과목 관리 (최고 관리자와 동일)
14. 자격증 관리 - 태그 관리 - 장 관리 (최고 관리자와 동일)
15. 자격증 관리 - 태그 관리 - 세부 절 관리 (최고 관리자와 동일)
16. 교재 관리
17. 교재 관리 - 교재 수정 (폼+목록)
18. 시험 관리 (최고 관리자와 동일)
19. 시험 관리 - 시험문제 (최고 관리자와 동일)
20. 문제 관리 (최고 관리자와 동일)
21. 공지사항 (최고 관리자와 동일)
22. 공지사항 작성 (등록) (최고 관리자와 동일)
~~ 20241024 ~~

23. 쿠폰 관리 ))기획?
    

비기봇 문제 및 해설 생성 관리자 /_res/bigibot.cr.A/

공통·서브+메인 템플릿 (Layout)

1. _템플릿.공통·서브 :
   | tp.sub.php (관리자.로그인후) (부품스타일)
   

본문 템플릿 (Contents)

1. CSS Component (Sample Demo)
   

20240903~ (( 화면설계서.Figma

1. 문제 생성 - 외부 자료 활용 (( m02 (( m01
   + 레이어팝업. 유의사항
   
2. 문제 생성 - 문제은행 자료 활용
   | 문제은행 자료 활용 예시
   + 레이어팝업. 유의사항
   + 레이어팝업. 문제 불러오기 (데이터 에듀 문제)
   
3. 문제 생성 - 문제 복원
   | 미완성 문제들을 완성 및 복원하는 페이지 예시
   
4. 생성 문제 점검 (비기봇 문제 생성 현황)
   | 레이어팝업. 입력 데이터 원본 문제 예시
   + 레이어팝업. 입력 데이터 원본 (이미지 or 문제)
   
5. 생성 문제 점검 - 1차 문제 검수
   | 레이어팝업. 수정 가능 범위 확인 예시
   + 문제 수정 토글 스위치
   + 검수 처리 버튼 기능
   + 레이어팝업. 수정 가능 범위 확인 (alert)
   
6. 문제 최종 검수 (비기봇 생성 문제 관리)
   + 레이어팝업. 문제 삭제 확인 (confirm)
   
7. 문제 최종 검수 - 문제 최종 검수
   | 레이어팝업. 수정 가능 범위 확인 예시
   + 문제 수정 토글
   + 레이어팝업. 수정 가능 범위 확인 (alert)
   
8. 삭제 문제 관리함 (휴지통)
   + 레이어팝업. 문제 보기
   + 레이어팝업. 문제 삭제 확인 (confirm)