[TCO] 직원 기능 수정후

수정된 것

  • 직원 기능 수정전에는 직원기능수정 PAGE가 단순 FORM 형태였다면 수정후에는
    AJAX를 통해 부분적으로 즉각 수정되도록 하였음
  • 목록출력 페이지 디자인을 갈아엎었음 (다른 사람들의 결과물과 협업과정에서 디자인을 통일하기위해)

직원 LIST

직원목록 출력

검색, 페이지 기능

코드

  • 페이징 검색을 위한 sql mapper
	<select id="emplist" resultType="EmpVO">
		SELECT T.RNUM, T.EMP_ID, T.EMP_NM , T.EMP_SE, T.CMNCD_CD, T.BRNCOFC_ID
		FROM (
		    SELECT ROW_NUMBER() OVER (ORDER BY EMP_ID) RNUM, EMP_ID, EMP_NM, EMP_SE, CMNCD_CD, BRNCOFC_ID
		    FROM   EMP
	               WHERE  1 = 1
		   <if test="keyWord!=null and keyWord!=''">
			    AND    (EMP_ID LIKE '%'||#{keyWord}||'%'
			    OR     EMP_NM LIKE '%'||#{keyWord}||'%' )
		  </if>
		) T
		WHERE T.RNUM BETWEEN #{currentPage}*7-6 AND #{currentPage}*7
	</select>

	<select id="selectCount" parameterType="hashMap" resultType="int">
		SELECT COUNT(*)
		FROM   EMP
		WHERE  1 = 1
	    <if test="keyWord!=null and keyWord!=''">
		    AND    (EMP_ID LIKE '%'||#{keyWord}||'%'
			OR     EMP_NM LIKE '%'||#{keyWord}||'%' )
	    </if>
	</select>
	
	<select id="sdselect" parameterType="String" resultType="cmncdVO">
		SELECT CMNCD_GU_NM, CMNCD_NM1, CMNCD_NM2
		FROM CMNCD
		WHERE CMNCD_CD = #{cmncdCd}
	</select>
  • 페이징 처리를 위한 vo생성

public class ArticlePage {

	//페이징 관련 멤버변수
		//전체 글의 행의 수
		private int total;
		//현재 페이지 번호
		private int currentPage;
		//전체 페이지 개수
		private int totalPages;
		//시작 페이지 번호
		private int startPage;
		//종료 페이지 번호
		private int endPage;
		//페이징의 개수
		private int pagingCount;
		//게시글 데이터
		private List<EmpVO> content;
		
		//생성자//
		//size : 한 화면에 보여질 행의 수
		public ArticlePage(int total, int currentPage, int size, int pagingCount,
				List<EmpVO> content) {
			this.total = total;
			this.currentPage = currentPage;
			this.content = content;
			this.pagingCount = pagingCount;
			
			if(total == 0) {//select 결과가 없다면..
				totalPages = 0;
				startPage = 0;
				endPage = 0;
			}else { //select 결과가 있을 때..
				//전체 페이지 개수 구하기(전체 글의 수 / 한 화면에 보여질 행의 수)
				//정수와 정수의 나눗셈의 결과는 정수이므로 13 / 7 => 1
				totalPages = total / size;
				//보정해줘야 할 경우는? 15 / 7 = 2 경우 처럼 나머지가 0보다 클 때 
				if(total % size>0) {
					//전체 페이지수를 1 증가 처리
					totalPages++;
				}
				
				//startPage : 이전 [1] [2] [3] [4] [5] 다음 일 때 1을 의미
				//공식 : startPage = 현재페이지 / 페이징의 개수 * 페이징의 개수 + 1;
				startPage = currentPage / pagingCount * pagingCount + 1;
				//보정해줘야 할 경우는? 5 / 5 * 5 + 1 => 6 경우처럼 
				//				현재페이지 % pagingCount == 0 일 때
				if(currentPage%pagingCount==0) {
					//startPage = startPage - 5(페이징의 개수);
					startPage -= pagingCount;
				}
				
				//endPage   : 이전 [1] [2] [3] [4] [5] 다음 일 때 5을 의미
				endPage = startPage + (pagingCount-1);
				//보정해줘야 할 경우는? endPage 5 > totalPages 3 일 때
				//				  endPage 5를 totalPages 3로 바꿔줘야 함
				if(endPage > totalPages) {
					endPage = totalPages;
				}
			}//end outer if
		}
		
		//전체 행의 수를 리턴
		public int getTotal() {
			return this.total;
		}
		
		//select결과가 없는가? 체킹 : true면 결과가 없다는 의미
		public boolean hasNoArticles() {
			return this.total == 0;
		}
		
		//select결과가 있는가? 체킹 : true면 결과가 있다는 의미
		public boolean hasArticles() {
			return this.total > 0;
		}
		
		//현재 페이지 번호 리턴
		public int getCurrentPage() {
			return this.currentPage;
		}
		
		//전체 페이지의 개수 리턴
		public int getTotalPages() {
			return totalPages;
		}
		
		//데이터 VO List 리턴
		public List<EmpVO> getContent(){
			return this.content;
		}
		
		//목록 하단의 시작 번호를 리턴
		public int getStartPage() {
			return this.startPage;
		}
		
		//목록 하단의 종료 번호를 리턴
		public int getEndPage() {
			return this.endPage;
		}
		
}
  • controller
@RequestMapping("/emp")
@Controller
public class EmpController {

	@Autowired
	EmpService empService;
	
	@Autowired
	JavaMailSender mailSender;	
	
	private static final Logger logger = 
			LoggerFactory.getLogger(EmpController.class);
	@GetMapping("/emplist")
	public String emplist(Model model, @RequestParam(defaultValue="1") int currentPage
			, @RequestParam(required=false) String keyWord
			, @RequestParam(defaultValue="7",required=false) int size, @RequestParam Map<String,Object> map) {	
		
		map.put("keyWord", keyWord);
		map.put("currentPage", currentPage);
		map.put("size", size);
	  
		logger.info(map.toString());
		//직원 목록
		List<EmpVO> list = this.empService.emplist(map);
		for(EmpVO empVO : list) {
			CmncdVO cmncdVO = new CmncdVO(); 
			cmncdVO = empService.sdselect(empVO.getCmncdCd());
						
			String brn = empService.brnselect(empVO.getBrncofcId());
			  
			empVO.setBrncofcNm(brn); 
			empVO.setOpt(cmncdVO.getCmncdGuNm());
			empVO.setDptopt(cmncdVO.getCmncdNm1());
			empVO.setLelopt(cmncdVO.getCmncdNm2());
			
		}
		
		logger.info("list능 ?" + list.toString());
		
		int total = this.empService.selectCount(map);
		model.addAttribute("list", 
				new ArticlePage(total, currentPage, size, 5, list));
		model.addAttribute("total", total);
		
		model.addAttribute("data", list);
		
		//forwarding
		return "emp/emplist";
	}
}
  • view
<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<head>
<title>거래처 목록</title>

</head>
<script src="/resources/js/jquery-3.6.0.min.js"></script>
<script type="text/javascript">
   function fn_click(){
      location.href="/emp/empinsert"
   }
   
   
    function fn_submit(){
       
       var frm = document.searchForm;
       console.log("frm.size : " + frm.size.value);
       console.log("frm.keyWord : " + frm.keyWord.value);
       frm.submit();
      }
</script>

 <!-- start page title -->
 <div class="row">
     <div class="col-12">
         <div class="page-title-box d-sm-flex align-items-center justify-content-between">
             <h1 class="mb-sm-0 font-size-20"><i class="bx bx-buildings"></i>직원관리</h1>

             <div class="page-title-right">
                 <ol class="breadcrumb m-0">
                     <li class="breadcrumb-item"><a href="javascript: void(0);">직원관리</a></li>
                     <li class="breadcrumb-item active">직원조회</li>
                 </ol>
             </div>

         </div>
     </div>
 </div>
 <!-- end page title -->

 <div class="row">
     <div class="col-12">
         <div class="card">
             <div class="card-body">
                 <div class="row mb-2">
                     <div class="col-sm-4">
                         <div class="search-box me-2 mb-2 d-inline-block">
                             <div class="position-relative">
                                   <!-- 검색  -->
                             <form name="searchForm" id="searchForm" action="/emp/emplist" method="get">
                             <div>
                                <input class="form-control" type="search"  name="keyWord" id="keyWord" value="${param.keyWord}" placeholder="사번(ID) 또는 이름을 입력해주세요">
                                   <!--  제발 submit 해주시궜어요????????? -->
                                   <i class="bx bx-search-alt search-icon"></i>
                             </div>
                              </form>
                             <!-- 검색끝  -->
                             </div>
                         </div>
                     </div>
                     <div class="col-sm-8">
                         <div class="text-sm-end">
                             <a href="/emp/empinsert" class="btn btn-success btn-rounded waves-effect waves-light mb-2 me-2"><i class="mdi mdi-plus me-1"></i> 직원 등록</a>
                         </div>
                     </div><!-- end col-->
                 </div>
               <!-- Nav tabs -->
               <!--직원조회-->
               <ul class="nav nav-tabs nav-tabs-custom" role="tablist">
                   <li class="nav-item">
                       <a class="nav-link active" data-bs-toggle="tab" href="#cnpt" role="tab">
                           <span class="d-none d-sm-block">거래처</span> 
                       </a>
                   </li>  
               </ul>

               <!-- Tab panes -->
               <!-- 직원조회 -->
               <div class="tab-content p-3">
                   <div class="tab-pane active" id="cnpt" role="tabpanel">
                <div class="table">
                     <table class="table align-middle table-nowrap table-check">
                        <thead class="table-light">
                            <tr>
                               <th style="width: 20px;" class="align-middle">No</th>
                               <th class="align-middle">id</th>
                               <th class="align-middle">이름</th>
                               <th class="align-middle">소속</th>
                               <th class="align-middle">직급</th>
                               <th class="align-middle">구분</th>
                               </tr>
                         </thead>

                        <tbody>
                         
                         <c:set var="i" value="${list.currentPage*7-6-1}" />
			                 <c:forEach items="${data}" var="data">
			                  
			                  <tr onClick="location.href='/emp/empdetail?empId=${data.empId}'">
						       <td>
							       <div class="form-check font-size-14">
							               	${data.rnum}
							       </div>
						       </td>
				   			   <td>
						           <h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">${data.empId}</a></h5>
						           <p class="text-muted mb-0">지점</p>
			      			   </td>
						       <td>  
						       		<h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">${data.empNm}</a></h5></td>
						       <td>
						           <div>
						               <a href="javascript: void(0);" class="badge badge-soft-primary font-size-15 m-1">${data.brncofcNm}</a>
						               <a href="javascript: void(0);" class="badge badge-soft-primary font-size-15 m-1">${data.dptopt}</a>
						           </div>
			      			   </td>
						       <td>
						            <h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">${data.lelopt}</a></h5>
						       </td>
						       <td>
						             <h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">${data.empSe}</a></h5>
						       </td>
						 	  </tr>
							</c:forEach>
						</tbody>
       			 	</table>
                                                     <!-- 페이징  -->
                <div class="row">
                       <div class="col-lg-12">
                           <ul class="pagination pagination-rounded justify-content-center mt-4">
                               <li class="page-item disabled <c:if test='${list.startPage<6}'>disabled</c:if>" >
                                   <a href="/emp/emplist?currentPage=${list.startPage-5}" class="page-link"><i class="mdi mdi-chevron-left"></i></a>
                               </li>
                               
                               <c:forEach var="pNo" begin="${list.startPage}" end="${list.endPage}" step="1">
                               <li class="page-item <c:if test='${list.currentPage eq pNo}'>active</c:if> " >
                                   <a href="/emp/emplist?currentPage=${pNo}" class="page-link">${pNo}</a>
                               </li>       
                               </c:forEach> 
                                                   
                               <li class="page-item <c:if test='${list.endPage>=list.totalPages}'>disabled</c:if> "  > 
                                   <a href="/emp/emplist?currentPage=${list.startPage+5}" class="page-link"><i class="mdi mdi-chevron-right"></i></a>
                               </li>
                           </ul>
                       </div>
                   </div>
                </div>
              </div>
            </div>
          </div>
        </div>
         <!-- end card -->
     </div>
 </div>
 <!-- end row -->


 <script src="assets/libs/jquery/jquery.min.js"></script>
 <script src="assets/libs/bootstrap/js/bootstrap.bundle.min.js"></script>
 <script src="assets/libs/metismenu/metisMenu.min.js"></script>
 <script src="assets/libs/simplebar/simplebar.min.js"></script>
 <script src="assets/libs/node-waves/waves.min.js"></script>
 <script src="assets/js/app.js"></script>

직원 INSERT

SELECT OPTION에서 본사 / 지점선택에 따라 부서와 직급 OPTION이 달라지도록함

코드

  • sql mapper
	<insert id="empinsert" parameterType="empVO">
			<selectKey order="BEFORE" keyProperty="empId,enabled" resultType="empVO">
				SELECT 'EMP' || LPAD(NVL(MAX(SUBSTR(EMP_ID,4)),0)+1,5,'0') AS empId,
				          MAX(enabled)+0 AS enabled
			            FROM EMP
			</selectKey>
			
			INSERT INTO EMP(EMP_ID, EMP_NM,  EMP_BRDT, EMP_MAIL, EMP_JNCMP_YMD,
	      					 EMP_PSWD, EMP_IP, EMP_ACTNO, EMP_SE, CMNCD_CD , EMP_IMG , EMP_TEL, ENABLED, BRNCOFC_ID)
			VALUES(#{empId},#{empNm},#{empBrdt},#{empMail}, #{empJncmpYmd},
			#{empPswd},#{empIp},#{empActno},#{empSe}, #{cmncdCd}, #{empImg}, #{empTel}, #{enabled}, #{brncofcId})
	</insert>

	<!-- attach_files 테이블로 첨부파일 insert -->
	<insert id="insertAttachFiles" parameterType="attachFilesVO">
		<selectKey order="BEFORE" keyProperty="atchfileId" resultType="Integer">
			SELECT NVL(MAX(ATCHFILE_ID),0)+1 FROM ATCHFILE
		</selectKey>			
		
		
		INSERT INTO ATCHFILE (ATCHFILE_ID, ATCHFILE_NM, ATCHFILE_SZ, ATCHFILE_DT ) 
		VALUES (#{atchfileId}, #{atchfileNm}, #{atchfileSz}, SYSDATE)		
	</insert>
	
	<select id="cdselect" parameterType="empVO" resultType="String">
		SELECT CMNCD_CD 
		FROM CMNCD
		WHERE CMNCD_NM1 = #{dptopt}
        AND CMNCD_NM2 = #{lelopt}
	</select>
  • 파일 첨부를 위한 vo 생성
@Repository
public class AttachFilesVO {

	private int atchfileId; // 파일 ID
	private String atchfileNm; // 파일명
	private String atchfileSz; // 파일 크기
	private String atchfileDt; // 파일 등록일
	private String cmncdCd;
	
	private String uploadFileName;
	private String uploadFileSize;
	
	
  // 오버라이드 getter/setter 길어서 생략

	
}
  • controller
	@GetMapping("/empinsert")
	public String getempinsert(Model model) {
	
		model.addAttribute("empVO", new EmpVO());
		return "emp/empinsert";
	}

		
	
	@PostMapping("/empinsert")
	public String postempinsert(EmpVO empVO) {
		
		logger.info("empVo는: "+ empVO);
		
		String cmncdCd = empService.cdselect(empVO);
		logger.info(cmncdCd);
		empVO.setCmncdCd(cmncdCd);
		
		
		//업로드한 파일 
		MultipartFile[] uploadFile = empVO.getUploadFile();
				
		//파일 저장 경로 설정
		String uploadFolder = 
		"D:\\A_TeachingMaterial\\6.JspSpring\\workspace\\TCO\\src\\main\\webapp\\resources\\upload";
		
		//연/월/일 폴더 생성 시작-------
		File uploadPath = new File(uploadFolder, getFolder());
		logger.info("uploadPath : " + uploadPath);
				
		if(uploadPath.exists()==false) {//해당 경로가 없으면 생성해줘야함
			uploadPath.mkdirs();			
		}
		//연/월/일 폴더 생성 끝-------
		
		
		AttachFilesVO vo = new AttachFilesVO();
	
		
		//이미지 3개를 업로드 한다면 3회 반복
		for(MultipartFile multipartFile : uploadFile) {
			logger.info("-----------");
			logger.info("파일명 : " + multipartFile.getOriginalFilename());
			logger.info("파일크기 : " + multipartFile.getSize());
			
			//각 파일 별로 세팅할 VO 
			
			
			//1) 파일id(기본키데이터), 파일시퀀스번호,파일명과 크기를 세팅
			
			vo.setAtchfileSz(""+multipartFile.getSize());
			vo.setAtchfileNm( multipartFile.getOriginalFilename());
			
			
			
			//-----------UUID 파일명 처리 시작 ----------------------------
			//동일한 이름으로 업로드되면 기존 파일을 지우게 되므로 이를 방지하기 위함
			UUID uuid = UUID.randomUUID();
			
			String uploadFileName = uuid.toString() + "-" + multipartFile.getOriginalFilename();
			// c:\\upload\\gongu03.jpg으로 조립
			// 이렇게 업로드 하겠다라고 설계 uploadFolder -> uploadPath
			// /resources/upload/2022/02/21/asdfsadfsdafsda_test.jpg
			vo.setUploadFileName("/resources/upload/" + getFolder() + "/" + uploadFileName);
			
			empVO.setEmpImg("/resources/upload/" + getFolder() + "/" + uploadFileName);
			
			File saveFile = new File(uploadPath,uploadFileName);
			//-----------UUID 파일명 처리 끝 ----------------------------
			
			try {
				//transferTo() : 물리적으로 파일 업로드가 됨
				multipartFile.transferTo(saveFile);
		
			}catch(Exception e){
				logger.info(e.getMessage());
			}//end catch
		}
		
		//attach_files 테이블로 insert
		empService.insertAttachFiles(vo);
				 
				
		logger.info("empVo는2: "+ empVO);
		int intresult = empService.empinsert(empVO);
		
		if(intresult>0) { //고객 등록 성공
			
			// 목록으로 이동
			return "redirect:/emp/emplist";
			
		}else {
			return "emp/empinsert";
		}
  
  //첨부파일을 보관하는 폴더를 연/월/일 계층 형태로 생성하기 위함
		private String getFolder() {
			SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
			Date date = new Date();
			String str = sdf.format(date);
			return str.replace("-", "/");
		}
  
	}
  • view
<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ page import = "java.util.Calendar" %>

<%
	String Today = new java.text.SimpleDateFormat("yyyy-MM-dd").format(new java.util.Date());
%>
<c:set value="<%=Today%>" var="Today" />

<script type="text/javascript">

function typeChange(e) {
	
    var c = ["인사(PM)", "기획(PL)", "영업(BU)", "물류(DT)"];
    var b = [ "관리(AD)", "창고(WM)", "매장(SM)", "총괄(GE)"];
   
    
    var cc = [ "부장", "과장", "대리", "사원"];
    var bb = [ "직급선택", "지점장", "팀장", "직원"];
    
    var target = document.getElementById("typeD");
    var targett = document.getElementById("typeDD");
    
    if(e.value == "BRN00000") var d = c; 
    else var d = b;

    if(e.value == "BRN00000") var dd = cc; 
    else var dd = bb; 
    
    
	/*  option이 중첩되지 않게 해준드아 */
    target.options.length = 0;
    targett.options.length = 0;
    

    for (x in d) {
        var opt = document.createElement("option");
        opt.value = d[x];
        opt.innerHTML = d[x];
        target.appendChild(opt);
    }   
    
    for (x in dd) {
    	//targett.empty();
        var opt = document.createElement("option");
        opt.value = dd[x];
        opt.innerHTML = dd[x];
        targett.appendChild(opt);
    }   
}

function fn_click(){
	
	location.href="/emp/emplist"
}

$(document).ready(function() {

 	  $('#typeDD').find('[value=지점장]').hide();
	  
	  $('#typeD').change(function() {
	    var result = $('#typeD option:selected').val();
	    alert(result);
	    // 총괄 선택시 직급에서 팀장, 직원 숨기기 
	    if (result == '총괄(GE)') {
	    	 /* alert("이얍"); */

	    	 $('#typeDD').find('[value=지점장]').show();
	    	 $('#typeDD').find('[value=팀장]').hide();
	    	 $('#typeDD').find('[value=직원]').hide();
	    	
	    } else {
	    	/* alert("키킼"); */

	    	 $('#typeDD').find('[value=팀장]').show();
	    	 $('#typeDD').find('[value=직원]').show();
	    	 $('#typeDD').find('[value=지점장]').hide();
	    }
	  });  
	}); 

</script>


    <!-- start page title -->
    <div class="row">
        <div class="col-12">
	         <div class="page-title-box d-sm-flex align-items-center justify-content-between">
	             <h1 class="mb-sm-0 font-size-20"><i class="bx bx-building-house"></i>직원 등록</h1>

                <div class="page-title-right">
                    <ol class="breadcrumb m-0">
                        <li class="breadcrumb-item"><a href="javascript: void(0);">직원기능</a></li>
                        <li class="breadcrumb-item active">직원등록</li>
                    </ol>
                </div>

            </div>
        </div>
    </div>
    <!-- end page title -->

    <div class="checkout-tabs">
            <div class="row">
            
                <div class="col-12">
                    <div class="card">
                        <div class="card-body">
                            <div class="tab-content" id="v-pills-tabContent">
                                <div class="tab-pane fade active show" id="v-pills-shipping" role="tabpanel" aria-labelledby="v-pills-shipping-tab">
                                    <div>
                                        <h4 class="card-title">직원관리</h4>
                                        <p class="card-title-desc">직원등록</p>
                                        <!-- ****************** FORM  시작 ****************  -->
                                        <form:form modelAttribute="empVO" method="post" action="/emp/empinsert" enctype="multipart/form-data">  
                                            <div class="form-group row mb-4">
                                                <label for="billing-name" class="col-md-2 col-form-label">이름</label>
                                                <div class="col-md-10">
                                                    <form:input path="empNm" class="form-control"  placeholder="Enter your name" />
                                                </div>
                                            </div>
                                            
                                            
                                            <div class="mb-3 row">
                                            <label for="example-date-input" class="col-md-2 col-form-label" >생년월일</label>
                                            <div class="col-md-10">
                                                <form:input path="empBrdt" class="form-control" type="date" value="${Today}" id="example-date-input"  />
                                            </div>
                                        </div>
                                        
                                   <div class="mt-3">
                                                        <label for="formFile" class="form-label">프로필 사진</label>
                                                        <input class="form-control" type="file" id="empImg" name="uploadFile">
                                       </div>
                                                
                                           <div class="form-group row mb-4">
                                                <label class="col-md-2 col-form-label">직급</label>
                                                <div class="col-md-10">
                                                <label class="col-md-2 col-form-label" for="type">[근무지]</label>
                                                    <form:select path ="brncofcId" class="form-select" onchange="typeChange(this)">
                                                        <option value="0" data-select2-id="6">유형을 선택해주세요</option>
                                                        <option value="BRN00000">본사</option>
                                                        <option value="BRN00003">부산지점</option>
                                                        <option value="BRN00001">대전지점</option>
                                                        <option value="BRN00002">인천지점</option>
                                                       
                                                   </form:select>
                                                                 
                                                     <label class="col-md-2 col-form-label" for="typeD">[부서]</label>
                                                      <form:select path="dptopt" class="form-select" id="typeD" name="typeD">
                                                        <option value="0" data-select2-id="6">부서를 선택해주세요</option>
                                                      </form:select>
                                                      
                                                      
                                                     <label class="col-md-2 col-form-label" for="typeDD">[직급]</label>
													<form:select path="lelopt" class="form-select" name="typeDD" id="typeDD">
														<option value="0" data-select2-id="6">직급을 선택해주세요</option>
													</form:select>
                                                </div>
                                            </div>
                                            <div class="mb-3 row">
                                            <label for="example-date-input" class="col-md-2 col-form-label">입사일</label>
                                            <div class="col-md-10">
                                                <form:input path="empJncmpYmd" class="form-control" type="date" value="${Today}" />
                                            </div>
                                        </div>
                                        
                                        
                                        <div class="form-group row mb-4">
                                                <label for="billing-email-address" class="col-md-2 col-form-label">연락처</label>
                                                <div class="col-md-10">
                                                    <form:input path ="empTel"  class="form-control" placeholder="Enter your tel" />
                                                </div>
                                            </div>
                                            
                                            
                                            <div class="form-group row mb-4">
                                                <label for="billing-email-address" class="col-md-2 col-form-label">Email Address</label>
                                                <div class="col-md-10">
                                                    <form:input path ="empMail" type="email" class="form-control" placeholder="Enter your email" />
                                                </div>
                                            </div>
                                            
                                            <div class="mb-3 row">
                                            <label for="example-password-input" class="col-md-2 col-form-label">비밀번호</label>
                                            <div class="col-md-10">
                                                <form:input path="empPswd" class="form-control" type="password" value="hunter2" placeholder="Enter Password" />
                                            </div>
                                        </div>
                                        
                                            <div class="form-group row mb-4">
                                                <label for="billing-phone" class="col-md-2 col-form-label">IP주소</label>
                                                <div class="col-md-10">
                                                    <form:input path="empIp" type="text" class="form-control" placeholder="Enter your Phone no." />
                                                </div>
                                            </div>
                                            
                                            <div class="form-group row mb-4">
                                                <label for="billing-phone" class="col-md-2 col-form-label">계좌번호</label>
                                                <div class="col-md-10">
                                                    <form:input path ="empActno" type="text" class="form-control"  placeholder="Enter your Phone no." />
                                                </div>
                                            </div>
                                            
                                            <div class="col-xl-3 col-sm-6">
                                                <div class="mt-4">
                                                    <label for="billing-phone" class="col-md-2 col-form-label">직원유형</label>
                                                    <div>
                                                        <div class="form-check form-check-right mb-3">
                                                            <form:radiobutton path="empSe" class="form-check-input"  checked="" value="정규직" name="정규직"  />
                                                            <label class="form-check-label" for="formRadiosRight1" >정규직</label>
                                                            
                                                        </div>
                                                       
                                                        <div class="form-check form-check-right mb-3">
                                                            <form:radiobutton path="empSe" class="form-check-input"  checked=""  value="퇴사" name="퇴사" />
                                                            <label class="form-check-label" for="formRadiosRight1" >퇴사</label>
                                                            
                                                        </div>
                                                    </div>


                                                </div>
                                            </div>
                                         <div class="col-sm-6">
		                            <div class="text-end">
		                             <!--    <a href="ecommerce-checkout.html" class="btn btn-success">
		                                    <i class="mdi mdi-truck-fast me-1"></i> Proceed to Shipping </a> -->
		                                    <button type="submit" class="btn btn-primary waves-effect waves-light w-sm">
		                                       <i class="mdi mdi-download d-block font-size-10"></i> 저장
		                                   </button>
		                            </div>
		                        </div> <!-- end col -->
                                            
                                        </form:form>
                                    </div>
                                </div>
                                
                                
                                <div class="tab-pane fade" id="v-pills-confir" role="tabpanel" aria-labelledby="v-pills-confir-tab">
                                	
                                	<div class="row">
                            <div class="col-lg-12">
                                <div class="card">
                                    <div class="card-body">
                                        <div class="table-responsive">
                                            <table class="table align-middle table-nowrap table-hover">
                                                <thead class="table-light">
                                                    <tr>
                                                        <th scope="col" style="width: 70px;">#</th>
                                                        <th scope="col">Name</th>
                                                        <th scope="col">Email</th>
                                                        <th scope="col">Tags</th>
                                                        <th scope="col">Projects</th>
                                                        <th scope="col">Action</th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    <tr>
                                                        <td>
                                                            <div class="avatar-xs">
                                                                <span class="avatar-title rounded-circle">
                                                                    D
                                                                </span>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">David McHenry</a></h5>
                                                            <p class="text-muted mb-0">UI/UX Designer</p>
                                                        </td>
                                                        <td>[email protected]</td>
                                                        <td>
                                                            <div>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Photoshop</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">illustrator</a>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            125
                                                        </td>
                                                        <td>
                                                            <ul class="list-inline font-size-20 contact-links mb-0">
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Message"><i class="bx bx-message-square-dots"></i></a>
                                                                </li>
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Profile"><i class="bx bx-user-circle"></i></a>
                                                                </li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <div>
                                                                <img class="rounded-circle avatar-xs" src="assets/images/users/avatar-2.jpg" alt="">
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">Frank Kirk</a></h5>
                                                            <p class="text-muted mb-0">Frontend Developer</p>
                                                        </td>
                                                        <td>[email protected]</td>
                                                        <td>
                                                            <div>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Html</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Css</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">2 + more</a>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            132
                                                        </td>
                                                        <td>
                                                            <ul class="list-inline font-size-20 contact-links mb-0">
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Message"><i class="bx bx-message-square-dots"></i></a>
                                                                </li>
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Profile"><i class="bx bx-user-circle"></i></a>
                                                                </li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <div>
                                                                <img class="rounded-circle avatar-xs" src="assets/images/users/avatar-3.jpg" alt="">
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">Rafael Morales</a></h5>
                                                            <p class="text-muted mb-0">Backend Developer</p>
                                                        </td>
                                                        <td>[email protected]</td>
                                                        <td>
                                                            <div>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Php</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Java</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Python</a>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            112
                                                        </td>
                                                        <td>
                                                            <ul class="list-inline font-size-20 contact-links mb-0">
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Message"><i class="bx bx-message-square-dots"></i></a>
                                                                </li>
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Profile"><i class="bx bx-user-circle"></i></a>
                                                                </li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <div class="avatar-xs">
                                                                <span class="avatar-title rounded-circle">
                                                                    M
                                                                </span>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">Mark Ellison</a></h5>
                                                            <p class="text-muted mb-0">Full Stack Developer</p>
                                                        </td>
                                                        <td>[email protected]</td>
                                                        <td>
                                                            <div>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Ruby</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Php</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">2 + more</a>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            121
                                                        </td>
                                                        <td>
                                                            <ul class="list-inline font-size-20 contact-links mb-0">
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Message"><i class="bx bx-message-square-dots"></i></a>
                                                                </li>
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Profile"><i class="bx bx-user-circle"></i></a>
                                                                </li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <div>
                                                                <img class="rounded-circle avatar-xs" src="assets/images/users/avatar-4.jpg" alt="">
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">Minnie Walter</a></h5>
                                                            <p class="text-muted mb-0">Frontend Developer</p>
                                                        </td>
                                                        <td>[email protected]</td>
                                                        <td>
                                                            <div>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Html</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Css</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">2 + more</a>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            145
                                                        </td>
                                                        <td>
                                                            <ul class="list-inline font-size-20 contact-links mb-0">
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Message"><i class="bx bx-message-square-dots"></i></a>
                                                                </li>
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Profile"><i class="bx bx-user-circle"></i></a>
                                                                </li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <div>
                                                                <img class="rounded-circle avatar-xs" src="assets/images/users/avatar-5.jpg" alt="">
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">Shirley Smith</a></h5>
                                                            <p class="text-muted mb-0">UI/UX Designer</p>
                                                        </td>
                                                        <td>[email protected]</td>
                                                        <td>
                                                            <div>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Photoshop</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">illustrator</a>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            136
                                                        </td>
                                                        <td>
                                                            <ul class="list-inline font-size-20 contact-links mb-0">
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Message"><i class="bx bx-message-square-dots"></i></a>
                                                                </li>
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Profile"><i class="bx bx-user-circle"></i></a>
                                                                </li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <div class="avatar-xs">
                                                                <span class="avatar-title rounded-circle">
                                                                    J
                                                                </span>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">John Santiago</a></h5>
                                                            <p class="text-muted mb-0">Full Stack Developer</p>
                                                        </td>
                                                        <td>[email protected]</td>
                                                        <td>
                                                            <div>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Ruby</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Php</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">2 + more</a>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            125
                                                        </td>
                                                        <td>
                                                            <ul class="list-inline font-size-20 contact-links mb-0">
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Message"><i class="bx bx-message-square-dots"></i></a>
                                                                </li>
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Profile"><i class="bx bx-user-circle"></i></a>
                                                                </li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <div>
                                                                <img class="rounded-circle avatar-xs" src="assets/images/users/avatar-5.jpg" alt="">
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <h5 class="font-size-14 mb-1"><a href="javascript: void(0);" class="text-dark">Colin Melton</a></h5>
                                                            <p class="text-muted mb-0">Backend Developer</p>
                                                        </td>
                                                        <td>[email protected]</td>
                                                        <td>
                                                            <div>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Php</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Java</a>
                                                                <a href="javascript: void(0);" class="badge badge-soft-primary font-size-11 m-1">Python</a>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            136
                                                        </td>
                                                        <td>
                                                            <ul class="list-inline font-size-20 contact-links mb-0">
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Message"><i class="bx bx-message-square-dots"></i></a>
                                                                </li>
                                                                <li class="list-inline-item px-2">
                                                                    <a href="javascript: void(0);" title="Profile"><i class="bx bx-user-circle"></i></a>
                                                                </li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                        <div class="row">
                                            <div class="col-lg-12">
                                                <ul class="pagination pagination-rounded justify-content-center mt-4">
                                                    <li class="page-item disabled">
                                                        <a href="javascript: void(0);" class="page-link"><i class="mdi mdi-chevron-left"></i></a>
                                                    </li>
                                                    <li class="page-item">
                                                        <a href="javascript: void(0);" class="page-link">1</a>
                                                    </li>
                                                    <li class="page-item active">
                                                        <a href="javascript: void(0);" class="page-link">2</a>
                                                    </li>
                                                    <li class="page-item">
                                                        <a href="javascript: void(0);" class="page-link">3</a>
                                                    </li>
                                                    <li class="page-item">
                                                        <a href="javascript: void(0);" class="page-link">4</a>
                                                    </li>
                                                    <li class="page-item">
                                                        <a href="javascript: void(0);" class="page-link">5</a>
                                                    </li>
                                                    <li class="page-item">
                                                        <a href="javascript: void(0);" class="page-link"><i class="mdi mdi-chevron-right"></i></a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        
                                </div>
                            </div>
                        </div>
                    </div>
             
                </div>
            </div>
        </div>
        <!-- end row -->
        
        <script src="assets/libs/jquery/jquery.min.js"></script>
        <script src="assets/libs/bootstrap/js/bootstrap.bundle.min.js"></script>
        <script src="assets/libs/metismenu/metisMenu.min.js"></script>
        <script src="assets/libs/simplebar/simplebar.min.js"></script>
        <script src="assets/libs/node-waves/waves.min.js"></script>
        <script src="assets/js/app.js"></script>
        

직원 DETAIL 및 UPDATE

  • 직원 삭제는 따로없고 퇴사 처리로 직원 정보 보관하도록함
  • 수정은 ajax를 통해 처리



코드

  • sql mapper
<select id="sdselect" parameterType="String" resultType="cmncdVO">
		SELECT CMNCD_GU_NM, CMNCD_NM1, CMNCD_NM2
		FROM CMNCD
		WHERE CMNCD_CD = #{cmncdCd}
	</select>
	
	<select id="empdetail" parameterType="empVO" resultType="empVO">
		SELECT EMP_ID, EMP_NM, EMP_ACTNO, EMP_JNCMP_YMD, EMP_BRDT, EMP_MAIL, 
		EMP_PSWD, EMP_IMG, EMP_IP, EMP_SE, EMP_TEL, CMNCD_CD, BRNCOFC_ID
		FROM EMP
		WHERE EMP_ID= #{empId}
	</select>
	

	<!-- 직원 정보 수정 -->
	<update id="empInfoUpdate" parameterType="empVO" >
		UPDATE EMP 
		   SET EMP_MAIL=#{empMail}
		     , EMP_TEL=#{empTel}
		     , EMP_ACTNO=#{empActno}
		 WHERE EMP_ID=#{empId}
		   AND EMP_PSWD=#{empPswd}
	</update>
	
	<!-- 연락처 수정 -->
	<update id="empTelupdate" parameterType="emp```
코드를 입력하세요
```VO" >
		UPDATE EMP 
		SET EMP_TEL=#{empTel}
		WHERE EMP_ID=#{empId}
	</update>
	
	<!-- 메일 수정  -->
	<update id="empMailupdate" parameterType="empVO" >
		UPDATE EMP 
		SET EMP_MAIL=#{empMail}
		WHERE EMP_ID=#{empId}
	</update>
	
	<!-- 비밀번호 수정  -->
	<update id="empPswdupdate" parameterType="empVO" >
		UPDATE EMP 
		SET EMP_PSWD = #{empPswd}
		WHERE EMP_ID=#{empId}
	</update>
	
	<!-- 상태 수정  -->
	<update id="empSeupdate" parameterType="empVO" >
		UPDATE EMP 
		SET EMP_SE = #{empSe}
		WHERE EMP_ID=#{empId}
	</update>
  • controller
@RequestMapping("/emp")
@Controller
public class EmpController {

	@Autowired
	EmpService empService;
	
	@Autowired
	JavaMailSender mailSender;	
	
	private static final Logger logger = 
			LoggerFactory.getLogger(EmpController.class);
  
@GetMapping("/empdetail")
	public String empdetail(Model model, @RequestParam Map<String, Object> map) {
		EmpVO empVO = new EmpVO();
		empVO.setEmpId((String)map.get("empId"));
		logger.info("before" + empVO.toString())
			 
		empVO = empService.empdetail(empVO);
		
  		String brn = empService.brnselect(empVO.getBrncofcId());

		CmncdVO cmncdVO = new CmncdVO(); 
		cmncdVO = empService.sdselect(empVO.getCmncdCd());
		
		empVO.setOpt(cmncdVO.getCmncdGuNm());
		empVO.setDptopt(cmncdVO.getCmncdNm1());
		empVO.setLelopt(cmncdVO.getCmncdNm2());
		
		model.addAttribute("data", empVO);
		
		return "emp/empdetail";
	}
  
  	// 수정시 @ResponseBody써줘야 ajax로 return값이 전달됨 !!
	// 직원 연락처수정
	@ResponseBody
	@PostMapping("/empTelupdate")
	public int empTelupdate(@ModelAttribute EmpVO empVO) {
		logger.info("emp를보시오"+empVO.toString());
		int isUpdateSuccess = empService.empTelupdate(empVO);
		logger.info("결과능: "+ isUpdateSuccess);

		return isUpdateSuccess;
		
	}
	
	// 직원 이메일 수정
	@ResponseBody
	@PostMapping("/empMailupdate")
	public int empMailupdate(@ModelAttribute EmpVO empVO) {

		int isUpdateSuccess = empService.empMailupdate(empVO);
		logger.info("결과능: "+ isUpdateSuccess);
		
		
		return isUpdateSuccess;
		
	}
	
	// 직원  비밀번호 수정
	@ResponseBody
	@PostMapping("/empPswdupdate")
	public int empPswdupdate(@ModelAttribute EmpVO empVO) {
		logger.info("emp를보시오"+empVO.toString());
		int isUpdateSuccess = empService.empPswdupdate(empVO);
		logger.info("결과능: "+ isUpdateSuccess);
		
		
		return isUpdateSuccess;
		
	}
	
	// 직원  유형 수정
	@ResponseBody
	@PostMapping("/empSeupdate")
	public int empSeupdate(@ModelAttribute EmpVO empVO) {
		
		int isUpdateSuccess = empService.empSeupdate(empVO);
		logger.info("결과능: "+ isUpdateSuccess);
		
		
		return isUpdateSuccess;
		
	}
  
 }
  • view
<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<style>
.card-title{
	font-size: 20px;
}
.col-form-label{
	font-size: 15px;
}
.bu{
	margin-right: 50px;
	float: right;
}
</style>

<script type="text/javascript">

	
    $(function(){
  //연락처 수정버튼 클릭시 전송	
	$("#Telbt").on("click", function(){
		
		//수정 전송
		$.ajax({
		    type: "POST",
		    url : "/emp/empTelupdate",
		    data : $("#formTel").serialize(), //Form의 값을 Controller의 empVO로 전달 
		    contentType : "application/x-www-form-urlencoded; charset=utf-8",
		    dataType : "json",
		    success : function(data){
		    	console.log("data뭐노?" + data);
		    	// 성공시 return값 String으로 받아오기 때문에 int로 바꿔주세요옹
		    	var res = parseInt(data);
		    	
		        if(res > 0){
		        // Sweet Alert
		          Swal.fire({
			          icon:'success',
			          title:'수정성공',
		       		}).then(function(){
		       			window.location.reload();
		       		})
		        }else{
		        	alert("업뎃안됨 와이라노");
		        }
				
		        
		    },
		    error : function(){
		        //Ajax 실패시
		    	Swal.fire({
			          icon:'error',
			          title:'에러데스까',
		       		}, function(){
		       			//새로고침
		       			window.location.reload();
		       			});
		    }
		});
	
		
	});
  
  // 이메일 수정버튼
	$("#Mailbt").on("click", function(){
		
		//수정 전송
		$.ajax({
		    type: "POST",
		    url : "/emp/empMailupdate",
		    data : $("#formMail").serialize(), //Form의 값을 Controller의 empVO로 전달 
		    contentType : "application/x-www-form-urlencoded; charset=utf-8",
		    dataType : "json",
		    success : function(data){
		    	console.log("data뭐노?" + data);
		    	// 성공시 return값 String으로 받아오기 때문에 int로 바꿔주세요옹
		    	var res = parseInt(data);
		    	
		        if(res > 0){
		        // Sweet Alert
		          Swal.fire({
			          icon:'success',
			          title:'성공데스까',
		       		}).then(function(){
		       			window.location.reload();
		       		})
		        }else{
		        	alert("업뎃안됨 와이라노");
		        }
				
		        
		    },
		    error : function(){
		        //Ajax 실패시
		    	Swal.fire({
			          icon:'error',
			          title:'에러데스까',
		       		}, function(){
		       			//새로고침
		       			window.location.reload();
		       			});
		    }
		});
	
		
	});
  
	 // 비밀번호 수정버튼
	$("#Pswdbt").on("click", function(){
		
		//수정 전송
		$.ajax({
		    type: "POST",
		    url : "/emp/empPswdupdate",
		    data : $("#formPswd").serialize(), //Form의 값을 Controller의 empVO로 전달 
		    contentType : "application/x-www-form-urlencoded; charset=utf-8",
		    dataType : "json",
		    success : function(data){
		    	console.log("data뭐노?" + data);
		    	// 성공시 return값 String으로 받아오기 때문에 int로 바꿔주세요옹
		    	var res = parseInt(data);
		    	
		        if(res > 0){
		        // Sweet Alert
		          Swal.fire({
			          icon:'success',
			          title:'성공데스까',
		       		}).then(function(){
		       			window.location.reload();
		       		})
		        }else{
		        	alert("업뎃안됨 와이라노");
		        }
				
		        
		    },
		    error : function(){
		        //Ajax 실패시
		    	Swal.fire({
			          icon:'error',
			          title:'에러데스까',
		       		}, function(){
		       			//새로고침
		       			window.location.reload();
		       			});
		    }
		});
	
		
	});
	 
	 // 상태 수정버튼
	$("#Sebt").on("click", function(){
		
		//수정 전송
		$.ajax({
		    type: "POST",
		    url : "/emp/empSeupdate",
		    data : $("#formSe").serialize(), //Form의 값을 Controller의 empVO로 전달 
		    contentType : "application/x-www-form-urlencoded; charset=utf-8",
		    dataType : "json",
		    success : function(data){
		    	console.log("data뭐노?" + data);
		    	// 성공시 return값 String으로 받아오기 때문에 int로 바꿔주세요옹
		    	var res = parseInt(data);
		    	
		        if(res > 0){
		        // Sweet Alert
		          Swal.fire({
			          icon:'success',
			          title:'성공데스까',
		       		}).then(function(){
		       			window.location.reload();
		       		})
		        }else{
		        	alert("업뎃안됨 와이라노");
		        }
				
		        
		    },
		    error : function(){
		        //Ajax 실패시
		    	Swal.fire({
			          icon:'error',
			          title:'에러데스까',
		       		}, function(){
		       			//새로고침
		       			window.location.reload();
		       			});
		    }
		});
	
		
	});
  
  
  
    });

</script>

<style>

.bu{
margin-left:1150px;
margin-top: 30px;
}

.im{
	width: 180px;
	height: 130px;
	border-radius: 5px;
	margin-left: 30px;
	margin-top: 30px;
}
</style>


    <!-- start page title -->
  <div class="row">
     <div class="col-12">
         <div class="page-title-box d-sm-flex align-items-center justify-content-between">
             <h1 class="mb-sm-0 font-size-20"><i class="bx bx-building"></i>직원정보</h1>

             <div class="page-title-right">
                 <ol class="breadcrumb m-0">
                     <li class="breadcrumb-item"><a href="javascript: void(0);">직원관리</a></li>
                     <li class="breadcrumb-item active">직원정보</li>
                 </ol>
             </div>

         </div>
     </div>
 </div>
    <!-- end page title -->

  
                
 <div class="col-12">
         <div class="card">
             <div class="card-body">
             
                 <div class="tab-content" id="v-pills-tabContent">
                     <div class="tab-pane fade active show" id="v-pills-shipping" role="tabpanel" aria-labelledby="v-pills-shipping-tab">
                         <div>

           <div class="d-flex gap-3">
                 	<h4 class="card-title">직원상세정보</h4>
		   </div>
	<br>
            <p class="text-muted mb-4">
            <div class="card overflow-hidden">
                                    <div class="bg-info bg-gradient">
                                        <div class="row">
                                            <div class="col-7">
                                               
                                            </div>
                                            <div class="col-5 align-self-end">
                                                <img src="assets/images/profile-img.png" alt="" class="img-fluid">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="card-body pt-0">
                                        <div class="row">
                                            <div class="col-sm-4">
                                                <div class="avatar-md profile-user-wid mb-4">
                                                    <img src="${data.empImg}" alt="" class="im">
                                                </div>
                                                
                                            </div>

                                            <div class="col-sm-8">
                                                <div class="pt-4">

                                                    <div class="row">
                                                        <div class="col-6">
                                                            <h4 class="font-size-18">이름</h4>
                                                            <b><p class="text-muted mb-0">${data.empNm}(${data.empId})</p></b>
                                                        </div>
                                                        <div class="col-6">
                                                            <h3 class="font-size-18">소속</h3>
                                                            <b><p class="text-muted mb-0">${data.brncofcNm}/${data.dptopt}</p></b>
                                                        </div>
                                                    </div>
                                                    <div class="mt-4">
                                                       <br>
                                                       <br>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
           
            <div>
                <table class="table table-nowrap mb-0">
                    <tbody>
                    
                        <tr>
                            <th scope="row">이름 :</th>
                            <td>${data.empNm}(${data.empId})</td>
                        </tr>
                        <tr>
                            <th scope="row">생년월일 :</th>
                             <fmt:formatDate var="empBrdt" value="${data.empBrdt}" pattern="yyyy-MM-dd"/>
                            <td>${empBrdt}</td>
                        </tr>
                        <tr>
                            <th scope="row">연락처 :</th>
                            <td>${data.empTel}&nbsp;
						<a href="#" class="font-size-16 text-success" data-bs-toggle="modal" data-bs-target="#exampleModal" data-bs-whatever="@mdo"><i class="mdi mdi-pencil font-size-18"></i></a>
	                 	
					</td>
                        </tr>
                        <tr>
                            <th scope="row">이메일 :</th>
                            <td>${data.empMail}
                            <a href="#" class="font-size-16 text-success" data-bs-toggle="modal" data-bs-target="#exampleModal2" data-bs-whatever="@mdo"><i class="mdi mdi-pencil font-size-18"></i></a>
                            </td>
                        </tr>
                        <tr>
                            <th scope="row">입사일 :</th>
                             <fmt:formatDate var="empJncmpYmd" value="${data.empJncmpYmd}" pattern="yyyy-MM-dd"/>
                            <td>${empJncmpYmd}</td>
                        </tr>
                        <tr>
                            <th scope="row">소속 :</th>
                            <td>${data.brncofcNm}</td>
                        </tr>
                        <tr>
                            <th scope="row">부서 :</th>
                            <td>${data.dptopt}</td>
                        </tr>
                        <tr>
                            <th scope="row">직급 :</th>
                            <td>${data.lelopt}</td>
                        </tr>
                        <tr>
                            <th scope="row">상태 :</th>
                            <td>${data.empSe}
                              <a href="#" class="font-size-16 text-success" data-bs-toggle="modal" data-bs-target="#exampleModal4" data-bs-whatever="@mdo"><i class="mdi mdi-pencil font-size-18"></i></a>
                            </td>
                        </tr>
                        <tr>
                            <th scope="row">IP :</th>
                            <td>${data.empIp}</td>
                        </tr>
                        <tr>
                            <th scope="row">비밀번호 :</th>
                            <td>${data.empPswd}
                            <a href="#" class="font-size-16 text-success" data-bs-toggle="modal" data-bs-target="#exampleModal3" data-bs-whatever="@mdo"><i class="mdi mdi-pencil font-size-18"></i></a>
                            </td>
                        </tr>
                    </tbody>
                </table>
                
                <div class="bu">
                
                <button type="button" class="btn btn-primary waves-effect waves-light" onClick="location.href='/emp/emplist'">목록으로</button>
            	</div>
            </div>
        
    <!-- end card -->

    
    <!-- end card -->
                        </div>
                     </div>
                 </div>
                 
                 
             </div>
         </div>
     </div>
     
 

        <!-- end row -->
        
        <script src="assets/libs/jquery/jquery.min.js"></script>
        <script src="assets/libs/bootstrap/js/bootstrap.bundle.min.js"></script>
        <script src="assets/libs/metismenu/metisMenu.min.js"></script>
        <script src="assets/libs/simplebar/simplebar.min.js"></script>
        <script src="assets/libs/node-waves/waves.min.js"></script>
        <script src="assets/js/app.js"></script>
        
        
   <!-- 연락처 Modal 시작 -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" >
    <div class="modal-dialog">
    
        <div class="modal-content">
            <div class="modal-header">
              
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
            <div>
               <div class="card-body">
        			
                    <h4 class="card-title">직원정보</h4>
                    <p class="card-title-desc">연락처수정</p>
                    <!-- ****************** FORM  시작 ****************  -->
                    <form:form modelAttribute="data" method="post" action="/emp/empupdate" name="formTel" id="formTel">  
                        
                    <div class="form-group row mb-4">
                            <label for="billing-email-address" class="col-md-2 col-form-label">연락처</label>
                            <div class="col-md-10">
                                <form:input type="text" path ="empTel" class="form-control" placeholder="Enter your tel" value="${empVO.empTel}" />
                            	<form:input type="text" path ="empId" class="form-control" hidden="true" />
                            </div>
                    </div>
               
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
                <button type="button" class="btn btn-primary" id="Telbt" name="Telbt">수정하기</button>
                
            </div>
              </form:form>
            </div>
        </div>
        
    </div>
</div>
</div>
</div>
<!-- Modal 끝 --> 
          
<!-- 이메일 Modal 시작 -->
<div class="modal fade" id="exampleModal2" tabindex="-1" aria-labelledby="exampleModalLabel" >
    <div class="modal-dialog">
    
        <div class="modal-content">
            <div class="modal-header">
              
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
            <div>
               <div class="card-body">
        			
                    <h4 class="card-title">직원정보</h4>
                    <p class="card-title-desc">이메일 수정</p>
                    <!-- ****************** FORM  시작 ****************  -->
                    <form:form modelAttribute="data" method="post" action="/emp/empupdate" name="formMail" id="formMail">  
                        
                    <div class="form-group row mb-4">
                            <label for="billing-email-address" class="col-md-2 col-form-label">이메일</label>
                            <div class="col-md-10">
                                <form:input type="text" path ="empMail" class="form-control" placeholder="Enter your tel" />
                                <form:input type="text" path ="empId" class="form-control" hidden="true" />
                            </div>
                    </div>
               
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
                <button type="button" class="btn btn-primary"  id="Mailbt" name="Mailbt">수정하기</button>
            </div>
              </form:form>
            </div>
        </div>
        
    </div>
</div>
</div>
</div>
<!-- Modal 끝 -->           
     
<!-- 비밀번호 Modal 시작 -->
<div class="modal fade" id="exampleModal3" tabindex="-1" aria-labelledby="exampleModalLabel" >
    <div class="modal-dialog">
    
        <div class="modal-content">
            <div class="modal-header">
              
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
            <div>
               <div class="card-body">
        			
                    <h4 class="card-title">직원정보</h4>
                    <p class="card-title-desc">비밀번호 수정</p>
                    <!-- ****************** FORM  시작 ****************  -->
                    <form:form modelAttribute="data" method="post" action="/emp/empupdate" id="formPswd" name="formPswd">  
                        
                    <div class="form-group row mb-4">
                            <label for="billing-email-address" class="col-md-2 col-form-label">비밀번호</label>
                            <div class="col-md-10">
                                <form:input type="text" path ="empPswd" class="form-control" placeholder="Enter your tel" />
                                <form:input type="text" path ="empId" class="form-control" hidden="true" />
                            </div>
                    </div>
               
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
                <button type="button" class="btn btn-primary"  id="Pswdbt" name="Pswdbt">수정하기</button>
            </div>
              </form:form>
            </div>
        </div>
        
    </div>
</div>
</div>
</div>
<!-- Modal 끝 --> 
          
<!-- 상태 Modal 시작 -->
<div class="modal fade" id="exampleModal4" tabindex="-1" aria-labelledby="exampleModalLabel" >
    <div class="modal-dialog">
    
        <div class="modal-content">
            <div class="modal-header">
              
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
            <div>
               <div class="card-body">
        			
                    <h4 class="card-title">직원정보</h4>
                    <p class="card-title-desc">상태 수정</p>
                    <!-- ****************** FORM  시작 ****************  -->
                    <form:form modelAttribute="data" method="post" action="/emp/empupdate" id="formSe" name="formSe">  
                        <form:input type="text" path ="empId" class="form-control" hidden="true" />
                      <div>
                           <div class="form-check form-check-right mb-3">
                               <form:radiobutton path="empSe" class="form-check-input"  checked="" value="정규직" name="정규직"  />
                               <label class="form-check-label" for="formRadiosRight1" >정규직</label>
                               
                           </div>
                           
                           <div class="form-check form-check-right mb-3">
                               <form:radiobutton path="empSe" class="form-check-input"  checked=""  value="퇴사" name="퇴사" />
                               <label class="form-check-label" for="formRadiosRight1" >퇴사</label>
                               
                           </div>
                       </div>
               
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
                <button type="button" class="btn btn-primary" id="Sebt" name="Sebt">수정하기</button>
            </div>
              </form:form>
            </div>
        </div>
        
    </div>
</div>
</div>
</div>
<!-- Modal 끝 -->           
     

좋은 웹페이지 즐겨찾기