team16_아프지망고(careMango)

Wiki

프로젝트 정보

• 센터 내 직원, 회원, 수강권, 일정 관리 등의 기능이 구현된 태블릿 기반 CRM 서비스를 React기반의 웹플랫폼 형태로 제작해 서비스의 크로스플랫폼 지원
• 개발 목표 : 수업 관리 시스템 제작 (PC)
• 개발 기간 : 2023.07.17 ~ 2023.08.10

팀 소개

안승지	김지효	이윤주	김유은
- 홈(로그인) - 마이페이지 - 일정 관리 메인페이지	- 개인 일정 관리(C) - 직원 관리(CRUD)	- 개인 일정 관리(RUD) - 수강권 부여/관리(CRUD) - 레이아웃	- 상담 일정 관리(CRUD) - 회원 관리(CRU)

기술 스택

Environment

Config

Development

Communication

시작 가이드

Requirements

For building and running the application you need:

• Node.js
• npm

Installation

$ git clone https://github.com/pie-sfac/1-16-careMango
$ cd 1-16-careMango
$ npm ci
$ npm run dev

ID / PASSWORD

id: team16
password: team16!!

API

• tui-calendar
• PoinT Api for SFAC React Project

주요 기능

1. 홈

1-1) 로그인

• 관리자 / 직원을 구분하여 로그인 할 수 있습니다.

• 계정 이름을 클릭하여 로그아웃 버튼을 활성화 시킬 수 있습니다.

  관리자 로그인

  
  직원 로그인

  
  로그아웃

  

1-2) 메인 페이지

• 일정관리 / 회원관리 / 센터관리 / 마이페이지 화면으로 접근이 가능합니다.

• 오늘의 총 일정 수, 센터 전체 회원 수, 센터의 전체 직원 수를 확인하여 표시합니다.

  메인 페이지

  

2. 일정 관리

2-1) 메인 페이지

• 상단 input.date 를 통해서 날짜를 조정할 수 있습니다.

• 월간, 주간, 일간 뷰를 선택하여 변경할 수 있습니다.

• 입력한 날짜를 기준으로 한달 동안의 총 일정, 취소 일정, 취소율 을 표시합니다.

• 일정 생성 버튼을 통해 개인 일정과 상담 일정의 생성 페이지로 접근이 가능합니다.

• 서버에서 일정 정보를 받아와 tui.calendar를 통해 달력 화면에 표시합니다.

• 상단 input.date 를 통해 입력한 날짜의 일정을 우측 사이드바에 표시합니다.

• 우측 사이드바를 통해 일정의 상세 페이지로 이동이 가능합니다.

  날짜 설정

  
  뷰 설정

  
  일정 생성 버튼

  
  일정의 상세 페이지로 이동

  

2-2) 개인 일정 관리

• 개인 일정을 관리합니다.

• 개인일정을 생성/조회/변경합니다.

• 개인일정 상세조회를 통해 일정을 변경할 수 있고 일정 취소가 가능합니다.

• 일정의 출석/결석 버튼을 통한 출결체크가 가능합니다.

  개인일정 생성

  
  개인일정 상세조회 / 변경

  
  개인일정 출결체크 / 취소

  

2-3) 상담 일정 관리

• 상담 일정을 관리합니다.

• 상담 일정을 생성/조회하며 상세 조회를 통해 일정 변경/취소가 가능합니다.

• 회원과의 상담 기록을 저장할 수 있으며 회원 정보를 등록할 수 있습니다.

• 유효성 검사 및 필수값 필드 입력을 완료해야만 저장 버튼이 활성화됩니다.

• 일정 및 시간 중복 선택이 불가합니다.

  상담 일정 생성 / 조회 / 상세조회 / 변경 / 취소

  

3. 회원 관리

• 회원을 관리합니다.

• 회원을 생성/조회하며 상세 조회를 통해 정보 변경이 가능합니다.

• 유효성 검사 및 필수값 필드 입력을 완료해야만 저장 버튼이 활성화됩니다.

• 회원 조회를 할 때 이름, 연락처로 검색이 가능합니다.

• 한 페이지당 최대 10명의 회원 목록만 보여집니다.

  회원 생성 / 조회 / 상세조회 / 변경

  

4. 수강권 관리

4-1) 센터 수강권

• 센터의 수강권을 관리합니다.

• 수강권을 생성/조회/편집/삭제할 수 있습니다.

• 유효성 검사 및 필수값 필드를 입력해야만 저장 버튼이 활성화됩니다.

• 수강권의 판매상태를 통해 판매종료 또는 판매가능 여부를 제어할 수 있습니다.

• 판매중, 판매종료 중인 수강권을 탭으로 분류합니다.

  센터 수강권 생성

  
  센터 수강권 수강권 부여내역 조회 / 편집 / 판매종료 / 판매가능 / 수강권 삭제

  

4-2) 회원 수강권

• 회원 수강권을 관리합니다.

• 회원에게 부여된 수강권을 조회하고 수강권을 부여할 수 있습니다.

• 회원에게 부여된 수강권을 일시중단/재진행/환불할 수 있습니다.

• 이용중, 종료된 수강권을 탭으로 분류합니다.

  회원 수강권 부여

  
  회원 수강권 상세조회 / 일시중단 / 재진행 / 환불

  

5. 직원 관리

• 직원을 관리합니다.

• 직원 생성, 조회, 변경, 삭제(퇴사)가 가능합니다.

• 직원 목록 조회 페이지에서 검색이 가능합니다.

  구현 화면

  

6. 마이 페이지

• 로그인한 계정의 정보를 확인할 수 있습니다.

  마이 페이지