관리자모드 임직원 관리 구현 1

  1. 먼저 관리자모드는 admin ID 하나로 통일한다.
  2. 권한은 세션에 담기고, 컬럼의 특정 값을 인식하면 admin계정이 인식된다.
  3. 어드민 로그인 페이지와 어드민 메인페이지는 별도다.
  4. 어드민 임직원 관리 페이지는 멤버페이지와 유사하되, 추가, 수정, 삭제 기능을 넣는다.

세팅

  • mybatis-config에 typeAlias와 mapper 등록
  • root-context.xml의 component scan에 dao, service 패키지 등록
  • servlet-context.xml의 component-scan에 control 패키지 등록
    -> 안 하면 no such bean 오류가 뜬다.

기능 구현을 위해 먼저 SQL문이 완성돼야 한다.

  • DAO, mybatis를 활용해 먼저 insert, update, delete SQL문을 완성한다.
  • Mapper 파일에 SQL문을 하나씩 추가하며, JUnit Test를 실행한다. 오류가 날 경우 다시 시작.
  • Service 단계에서 이용자의 활용 경로에 대한 경우의 수를 그려본다.
  • Controller에서 rest를 생각하고, 각 SQL에 맞는 데이터를 보내도록 Controller를 구현.

임직원 추가 : insert

파라미터 타입은 해시맵으로 employeeId(key), CEO002(Value) 같은 형식으로 받아올지, 아니면 Employee 객체에 담아 받아올지 고민된다. 일단 employee로.

Employee로 하면서 Mapper에 적용된 SQL에 에러가 있다고 함.

There is no getter for property named 'departmentId' in 'class com.group.employee.dto.Employee' 이건 다른 테이블에서 참조해온 컬럼이 오류를 일으킨 거라, #{department.departmentId} 같은 식으로 변수명을 조정해주면 된다.

임직원 추가 경우의 수

  • 이름, id, 부서, 직무, 직급이 null일 때 : not null 제약조건으로 back단에서 오류 뜸. front에서 오류메시지가 뜨도록 해야 할 듯. ajax를 통하여
  • 이미 같은 사번과 같은 이메일, 전화번호가 있을 때 오류 메시지 띄워야 할 듯

Controller Test
restful을 활용, yarc에서 테스트. ajax로 소통할 때, 데이터는 다음과 같이 처리해야 한다.

{
"employeeId":"CEO004",
"department":{"departmentId":"CEO"},
"job":{"jobId":"Op"},
"position":{"positionId":"1"},
"phoneNumber":"010",
"email":"이메일",
"enabled":"1",
"password":"1234"
}

객체 안에 있는 변수의 데이터타입이 객체일 경우, "department":{"departmentId":"CEO"}과 같이 처리해줘야 인식할 수 있다.

임직원 수정

  • 이름, 부서, 직무, 직급, 전화번호, 고용일자, 상태, 비밀번호 수정 가능하도록
    ORA-01747: 열명을 올바르게 지정해 주십시오 오류 발생 -> 쉼표 때문에 ^^;
  • 이메일 수정의 경우, 이메일 양식만 입력 가능하도록 해야할 듯

임직원 수정 프론트

  • 임직원 상세보기에 수정 버튼 추가. 관리자일 경우에만 보이게 할 것. display-none을 통하여 id : modifyEmpBtn

JS 작업 순서
1) 수정 클릭 시 수정 모달창(id:modalModify) 뜨게 하기
2) 수정 모달창에 기존 값 들어가 있게 하기

작업을 하다가 직무, 직급 등은 text가 아닌 select로 하는 게 맞다고 생각했다. 그런데 만약 회사에서 직무, 직급에 변동이 생길 경우, html에서 하드코딩으로 일일이 바꿔주는 건 너무 불편할 거 같아 DB에서 바로 직무, 직급을 불러와 동적으로 프론트까지 연결되는 코드를 만들기로 했다.

처음에는 List<객체>로 return 값을 받아오다가, ajax에서 일일이 불러오기가 불편해 List<스트링>으로 바꿔버렸다.

DAO 단에서는 객체 리스트로 불러왔지만, Service 단에서 스트링타입의 리스트로 바꿔버림.

public List<String> showJob() throws FindException{
		ArrayList<String> list = new ArrayList<String>();
	
		for (int j = 0; j < dao.findJob().size(); j++) {
			String jobTitle = dao.findJob().get(j).getJobTitle();
			list.add(jobTitle);
			System.out.println(list);
		}
		return list;
		
		
	}

기존에 선택돼 있던 값을 select의 option에 반영하기 위한 코드는 다음과 같다.

  var positionOpt = document.querySelectorAll("#positionSelect option");


        for (var i = 0; i < positionOpt.length; i++) {
          if (positionOpt[i].value == responseData.position.positionTitle) {
            $("#positionSelect option:eq(" + i + ")").attr(
              "selected",
              "selected"
            );
            break;
          }
        }

임직원 개인의 상세정보가 뜨는 모달창의 get ajax가 실행될 때 위와 같은 코드를 넣어줘야 변동사항을 반영할 수 있다.

3) 수정 완료 버튼 클릭 시 수정 완료 되게 하고, 새로고침하기
4) 어드민 계정만 수정 버튼 보이게 작업하기

좋은 웹페이지 즐겨찾기