최신글
hyeonga_code
reProject_32_배송관리 페이지 작업 본문
반응형
2024.01.20
배송관리는 택배사를 관리하는 페이지가 있어야 해서 작업한 기능이다.
택배사 리스트 페이지, 택배사 추가, 수정, 삭제 기능을 구현했다.
따로 상세 페이지가 있을만큼 상세 내용이 많지 않아 ADMINLTE3의 모달 창 기능을 사용해서 작업했다.
1. DeliveryController.java 작성
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
|
package com.w2.admin.controller;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import com.w2.delivery.DeliveryVO;
import com.w2.delivery.service.DeliveryService;
import com.w2.util.ResponseDTO;
import com.w2.util.Search;
@Controller
public class DeliveryController {
@Autowired
private DeliveryService deliveryService;
/**
* 택배사 목록 가져오기
* @param model
* @return
*/
@RequestMapping("deliveryList.mdo")
public String deliveryList(Model model, @RequestParam(required = false, defaultValue = "1") int page,
@RequestParam(required = false, defaultValue = "1") int range, @RequestParam(required = false, defaultValue = "productName") String searchType,
@RequestParam(required = false) String keyword, @ModelAttribute("search") Search search) {
// 검색
model.addAttribute("search", search);
search.setSearchType(searchType);
search.setKeyword(keyword);
// 전체 게시글 개수
int listCnt = deliveryService.getProductListCnt(search);
// 검색 페이지 정보
search.pageInfo(page, range, listCnt);
// 페이징
model.addAttribute("pagination", search);
// 화면 출력
model.addAttribute("deliveryList", deliveryService.getProductList(search));
return "delivery/deliveryList";
}
/**
* 택배사 등록
* @return
*/
@ResponseBody
@RequestMapping("deliveryInsert.mdo")
public ResponseDTO<DeliveryVO> DeliveryInsert(DeliveryVO deli) {
Integer statusCode = HttpStatus.OK.value();
int code;
String resultCode;
String message;
try {
int result = deliveryService.insertDelivery(deli);
if(result > 0) {
code = 1;
resultCode = "success";
message = "등록이 완료되었습니다.";
} else if (result == -2){
code = -2;
resultCode = "fail";
message = "택배사번호가 이미 존재합니다.";
} else {
code = -1;
resultCode = "fail";
message = "오류가 발생했습니다. 다시 시도해주세요";
}
} catch (Exception e) {
e.printStackTrace();
code = -1;
resultCode = "fail";
message = "오류가 발생했습니다. 다시 시도해주세요";
}
return new ResponseDTO<DeliveryVO>(statusCode, code, resultCode, message, deli);
}
/**
* 택배사 수정
* @return
*/
@ResponseBody
@RequestMapping("deliveryUpdate.mdo")
public ResponseDTO<DeliveryVO> DeliveryUpdate(DeliveryVO deli) {
Integer statusCode = HttpStatus.OK.value();
int code;
String resultCode;
String message;
try {
int result = deliveryService.updateDelivery(deli);
if(result > 0) {
code = 1;
resultCode = "success";
message = "수정되었습니다.";
} else {
code = -1;
resultCode = "fail";
message = "오류가 발생했습니다. 다시 시도해주세요";
}
} catch (Exception e) {
e.printStackTrace();
code = -1;
resultCode = "fail";
message = "오류가 발생했습니다. 다시 시도해주세요";
}
return new ResponseDTO<DeliveryVO>(statusCode, code, resultCode, message, deli);
}
/**
* 택배사 삭제
* @return
*/
@ResponseBody
@RequestMapping("deliveryDelete.mdo")
public ResponseDTO<DeliveryVO> deleteDeli(DeliveryVO deli) {
Integer statusCode = HttpStatus.OK.value();
int code;
String resultCode;
String message;
try {
int result = deliveryService.deleteDelivery(deli.getDeliveryId());
if(result > 0) {
code = 1;
resultCode = "success";
message = "삭제되었습니다.";
} else {
code = -1;
resultCode = "fail";
message = "오류가 발생했습니다. 다시 시도해주세요";
}
} catch (Exception e) {
e.printStackTrace();
code = -1;
resultCode = "fail";
message = "오류가 발생했습니다. 다시 시도해주세요";
}
return new ResponseDTO<DeliveryVO>(statusCode, code, resultCode, message, deli);
}
}
|
2. DeliveryService.java 작성
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
package com.w2.delivery.service;
import java.util.HashMap;
import java.util.List;
import com.w2.delivery.DeliveryVO;
import com.w2.util.Search;
public interface DeliveryService {
List<HashMap<String, Object>> getProductList(Search search); // 택배사 목록 가져오기
int getProductListCnt(Search search); // 택배사 목록 개수 가져오기
int insertDelivery(DeliveryVO deli); // 택배사 신규 등록
int updateDelivery(DeliveryVO deli); // 택배사 수정
int deleteDelivery(String deliveryId); // 택배사 삭제
}
|
3. DeliveryServiceImple.java 작성
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
package com.w2.delivery.service;
import java.util.HashMap;
import java.util.List;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.w2.delivery.DeliveryDAO;
import com.w2.delivery.DeliveryVO;
import com.w2.util.Search;
@Service("DeliveryService")
public class DeliveryServiceImple implements DeliveryService {
@Autowired
private DeliveryDAO deliveryDAO;
@Override
public List<HashMap<String, Object>> getProductList(Search search) {
return deliveryDAO.getDeliveryList(search);
}
@Override
public int getProductListCnt(Search search) {
return deliveryDAO.getDeliveryListCnt(search);
}
@Override
public int insertDelivery(DeliveryVO deli) {
if(deliveryDAO.checkDelivery(deli.getDeliveryId()) > 0) {
return -2;
}
return deliveryDAO.insertDelivery(deli);
}
@Override
public int updateDelivery(DeliveryVO deli) {
return deliveryDAO.updateDelivery(deli);
}
@Override
public int deleteDelivery(String deliveryId) {
return deliveryDAO.deleteDelivery(deliveryId);
}
}
|
4. DeliveryDAO.java 작성
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
|
package com.w2.delivery;
import java.util.HashMap;
import java.util.List;
import org.mybatis.spring.SqlSessionTemplate;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Repository;
import com.w2.util.Search;
@Repository
public class DeliveryDAO {
@Autowired
private SqlSessionTemplate sqlSessionTemplate;
public List<HashMap<String, Object>> getDeliveryList(Search search) {
return sqlSessionTemplate.selectList("DeliveryDAO.getDeliveryList", search);
}
public int getDeliveryListCnt(Search search) {
return sqlSessionTemplate.selectOne("DeliveryDAO.getDeliveryListCnt", search);
}
public int insertDelivery(DeliveryVO deli) {
return sqlSessionTemplate.insert("DeliveryDAO.insertDelivery", deli);
}
public int updateDelivery(DeliveryVO deli) {
return sqlSessionTemplate.update("DeliveryDAO.updateDelivery", deli);
}
public int deleteDelivery(String deliveryId) {
return sqlSessionTemplate.delete("DeliveryDAO.deleteDelivery", deliveryId);
}
public int checkDelivery(String deliveryId) {
return sqlSessionTemplate.selectOne("DeliveryDAO.checkDelivery", deliveryId);
}
}
|
5. delivery-mapping.xml 작성
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
|
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="DeliveryDAO">
<select id="getDeliveryList" resultType="hashMap">
SELECT *
FROM delivery
<trim prefix="WHERE" prefixOverrides="AND|OR">
<if test="keyword != null and keyword != ''">
<if test="searchType == 'deliveryId'">
AND deliveryId like CONCAT('%', #{keyword}, '%')
</if>
<if test="searchType == 'deliveryComName'">
AND deliveryComName like CONCAT('%', #{keyword}, '%')
</if>
</if>
</trim>
ORDER BY deliveryId DESC
LIMIT #{startList}, #{listSize};
</select>
<select id="getDeliveryListCnt" resultType="int">
SELECT count(*)
FROM delivery
<trim prefix="WHERE" prefixOverrides="AND|OR">
<if test="keyword != null and keyword != ''">
<if test="searchType == 'deliveryId'">
AND deliveryId like CONCAT('%', #{keyword}, '%')
</if>
<if test="searchType == 'deliveryComName'">
AND deliveryComName like CONCAT('%', #{keyword}, '%')
</if>
</if>
</trim>
</select>
<insert id="insertDelivery">
INSERT delivery
VALUES(#{ deliveryId }, #{ deliveryComName }, #{ deliveryComNum }, #{ deliveryPrice }, #{ deliveryName }, #{ deliveryNum })
</insert>
<update id="updateDelivery">
UPDATE delivery
SET deliveryComName=#{ deliveryComName },
deliveryComNum=#{ deliveryComNum },
deliveryPrice=#{ deliveryPrice },
deliveryName=#{ deliveryName },
deliveryNum=#{ deliveryNum }
WHERE deliveryId=#{ deliveryId }
</update>
<delete id="deleteDelivery">
DELETE FROM delivery
WHERE deliveryId=#{ deliveryId }
</delete>
<select id="checkDelivery" resultType="int">
SELECT count(*) FROM delivery WHERE deliveryId=#{ deliveryId }
</select>
</mapper>
|
6. mybatis-config.xml 수정
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
|
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
<typeAliases>
<!-- typeAlias
- 매핑파일에서 사용하는 type을 지정
- 애플리케이션에서 SQL 문으로 값을 전달합니다
- SQL 문 실행 시 반환되는 레코드를 저장하는 용도로 사용하기 위한 빈을 생성합니다.-->
<typeAlias type="com.w2.admin.AdminVO" alias="admin"/>
<typeAlias type="com.w2.client.ClientVO" alias="client"/>
<typeAlias type="com.w2.board.NoticeVO" alias="notice"/>
<typeAlias type="com.w2.board.QnaVO" alias="qna"/>
<typeAlias type="com.w2.board.TermsVO" alias="terms"/>
<typeAlias type="com.w2.product.ProductVO" alias="product"/>
<typeAlias type="com.w2.product.ProductPriceVO" alias="productPrice"/>
<typeAlias type="com.w2.product.OptionVO" alias="option"/>
<typeAlias type="com.w2.order.OrderVO" alias="order"/>
<typeAlias type="com.w2.delivery.DeliveryVO" alias="delivery"/>
</typeAliases>
<!-- SQL 작성문을 지정하여 mapper 파일 경로 알려주는 역할입니다. -->
<mappers>
<mapper resource="mappings/admin-mapping.xml"/>
<mapper resource="mappings/notice-mapping.xml"/>
<mapper resource="mappings/client-mapping.xml"/>
<mapper resource="mappings/qna-mapping.xml"/>
<mapper resource="mappings/terms-mapping.xml"/>
<mapper resource="mappings/product-mapping.xml"/>
<mapper resource="mappings/order-mapping.xml"/>
<mapper resource="mappings/delivery-mapping.xml"/>
</mappers>
</configuration>
|
7. deliveryList.jsp 작성
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
|
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>WeatherWear 관리자</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<!-- Font Awesome -->
<link href="resources/admin/AdminLTE/plugins/fontawesome-free/css/all.min.css" rel="stylesheet">
<!-- Theme style -->
<link href="resources/admin/AdminLTE/dist/css/adminlte.min.css" rel="stylesheet">
</head>
<body class="hold-transition sidebar-collapse layout-top-nav">
<div class="wrapper">
<%@ include file="../header.jsp" %>
<div class="content-header">
<section class="content-header">
<div class="container">
<div class="row mb-2">
<div class="col-sm-6">
<h1>배송 관리</h1>
</div>
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">
<li class="breadcrumb-item"><a href="main.mdo">메인</a></li>
<li class="breadcrumb-item active">배송 관리</li>
</ol>
</div>
</div>
</div>
</section>
<section class="content">
<div class="container">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<div class="card-title">
<div class="orderby_btn">
<button type="button" class="btn btn-sm btn-outline-primary" onclick="newDeli()">+추가</button>
</div>
</div>
<div class="card-tools">
<!-- Search -->
<div class="input-group input-group-sm">
<select id="orderType" class="form-control">
<option value="deliveryId">번호</option>
<option value="deliveryComName">이름</option>
</select>
<input type="text" id="keyword" class="form-control float-right" placeholder="Search">
<div class="input-group-append">
<button type="button" class="btn btn-default" id="btnSearch">
<i class="fas fa-search"></i>
</button>
</div>
</div>
<!-- End Search -->
</div>
</div>
<div class="card-body table-responsive p-0">
<form id="listForm" name="clientForm" method="post">
<table class="table table-hover text-nowrap" style="table-layout: fixed;">
<colgroup>
<col width="80px"/><!-- # -->
<col width="280px"/><!-- 택배회사번호 -->
<col width="150px"/><!-- 택배회사이름 -->
<col width="200px"/><!-- 택배회사연락처 -->
<col width="100px"/><!-- 택배비 -->
<col width="100px"/><!-- 담당자 -->
<col width="150px"/><!-- 담당자 연락처 -->
</colgroup>
<thead>
<tr>
<th>#</th>
<th>택배회사번호</th>
<th>택배회사이름</th>
<th>택배회사연락처</th>
<th>택배비</th>
<th>담당자</th>
<th>담당자 연락처</th>
</tr>
</thead>
<tbody>
<c:forEach var="deli" items="${deliveryList}" varStatus="status">
<tr onclick="deliveryInfo('${deli.deliveryId}')" class="${deli.deliveryId}">
<td>${ status.index+1 }</td>
<td id="deliveryId_${deli.deliveryId}">${deli.deliveryId}</td>
<td id="deliveryComName_${deli.deliveryId}">${deli.deliveryComName}</td>
<td id="deliveryComNum_${deli.deliveryId}">${deli.deliveryComNum}</td>
<td id="deliveryPrice_${deli.deliveryId}">${deli.deliveryPrice}</td>
<td id="deliveryName_${deli.deliveryId}">${deli.deliveryName}</td>
<td id="deliveryNum_${deli.deliveryId}">${deli.deliveryNum}</td>
</tr>
</c:forEach>
</tbody>
</table>
</form>
</div>
<!-- Modal -->
<div class="modal fade show" id="modal-default" style="display: none; padding-right: 17px;" aria-modal="true" role="dialog">
</div>
<!-- pagination -->
<div class="card-footer">
<div class="card-title input-group-sm">
<select name="searchType" class="form-control" id="listSize" onchange="page(1)">
<option value="5" <c:if test="${pagination.getListSize() == 5}">selected="selected"</c:if>>5개</option>
<option value="10" <c:if test="${pagination.getListSize() == 10}">selected="selected"</c:if>>10개</option>
<option value="15" <c:if test="${pagination.getListSize() == 15}">selected="selected"</c:if>>15개</option>
<option value="30" <c:if test="${pagination.getListSize() == 30}">selected="selected"</c:if>>30개</option>
</select>
</div>
<ul class="pagination pagination-sm m-0 float-right">
<c:if test="${pagination.prev}">
<li class="page-item">
<a class="page-link" href="#" onclick="fn_prev('${pagination.page}', '${pagination.range}', '${pagination.rangeSize}', '${pagination.listSize}', '${search.searchType}', '${search.keyword}')">«</a>
</li>
</c:if>
<c:forEach begin="${pagination.startPage}" end="${pagination.endPage}" var="pageId">
<li class="page-item <c:out value="${pagination.page == pageId ? 'active':''}"/>">
<a class="page-link" href="#" onclick="fn_pagination('${pageId}', '${pagination.range}', '${pagination.rangeSize}', '${pagination.listSize}', '${search.searchType}', '${search.keyword}')">${pageId}</a>
</li>
</c:forEach>
<c:if test="${pagination.next}">
<li class="page-item">
<a class="page-link" href="#" onclick="fn_next('${pagination.page}', '${pagination.range}', '${pagination.rangeSize}', '${pagination.listSize}', '${search.searchType}', '${search.keyword}')">»</a>
</li>
</c:if>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<%@ include file="../footer.jsp" %>
</div>
<div class="modal-backdrop fade" style="display:none"></div>
<!-- jQuery -->
<script src="resources/admin/AdminLTE/plugins/jquery/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script src="resources/admin/AdminLTE/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Modal -->
<script src="resources/admin/AdminLTE/plugins/sweetalert2/sweetalert2.min.js"></script>
<script src="resources/admin/AdminLTE/dist/js/adminlte.min.js?v=3.2.0"></script>
<script src="resources/util/js/paging.js"></script>
<script src="resources/util/js/modal.js"></script>
<script src="resources/util/js/checkbox.js"></script>
<script src="resources/admin/js/manageDelivery.js"></script>
</body>
</html>
|
8. manageDelivery.js 파일 작성
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
|
/**
*
*/
// 기본 정보 수정
function deliveryInfo(id){
let deliveryId = id;
let deliveryComName = document.querySelector("#deliveryComName_"+id).innerText;
let deliveryComNum = document.querySelector("#deliveryComNum_"+id).innerText;
let deliveryPrice = document.querySelector("#deliveryPrice_"+id).innerText;
let deliveryName = document.querySelector("#deliveryName_"+id).innerText;
let deliveryNum = document.querySelector("#deliveryNum_"+id).innerText;
let deliInfo = '';
deliInfo += "<div class='modal-dialog' id='" + deliveryId + "'><div class='modal-content'><div class='modal-header'><h4 class='modal-title'>정보 수정</h4>";
deliInfo += "<button type='button' class='close' data-dismiss='modal' aria-label='Close' onclick='closeModal()'><span aria-hidden='true'>×</span></button></div>";
deliInfo += "<div class='modal-body'><div class='form-group'><label for='exampleInputBorderWidth2'>택배회사번호 <code>변경할 수 없습니다.</code></label>";
deliInfo += "<input type='text' name='deliveryId' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' value='" + deliveryId + "' disabled='disabled'>";
deliInfo += "</div><div class='form-group'><label for='exampleInputBorderWidth2'>택배회사이름<code></code></label>";
deliInfo += "<input type='text' name='deliveryComName' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' value='" + deliveryComName + "'>";
deliInfo += "</div><div class='form-group'><label for='exampleInputBorderWidth2'>택배회사 연락처<code></code></label>";
deliInfo += "<input type='text' name='deliveryComNum' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' value='" + deliveryComNum + "'>";
deliInfo += "</div><div class='form-group'><label for='exampleInputBorderWidth2'>택배비<code></code></label>";
deliInfo += "<input type='text' name='deliveryPrice' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' value='" + deliveryPrice + "'>";
deliInfo += "</div><div class='form-group'><label for='exampleInputBorderWidth2'>담당자<code></code></label>";
deliInfo += "<input type='text' name='deliveryName' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' value='" + deliveryName + "'>";
deliInfo += "</div><div class='form-group'><label for='exampleInputBorderWidth2'>담당자 연락처<code></code></label>";
deliInfo += "<input type='text' name='deliveryNum' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' value='" + deliveryNum + "'>";
deliInfo += "</div></div><div class='modal-footer justify-content-between'><button type='button' class='btn btn-default' data-dismiss='modal' onclick='closeModal()'>취소하기</button>";
deliInfo += "<div style='width:30%'></div>";
deliInfo += "<button type='button' class='btn btn-outline-danger' onclick='deleteDeli(this)'>삭제하기</button><button type='button' class='btn btn-primary' onclick='deli(1)'>수정하기</button></div></div></div>";
openModel(deliInfo);
}
//삭제
function deleteDeli(target){
let deliveryId = target.parentElement.parentElement.parentElement.id;
if(confirm("택배사 정보를 삭제하시겠습니까?")){
$.ajax({
type: "post",
url: "deliveryDelete.mdo",
dataType: "json",
data: {
deliveryId: deliveryId,
},
success: function(res) {
if(res.code == -1) {
alert(res.message);
return;
}
if(res.code == 1) {
alert(res.message);
window.location.reload();
}
},
error: function(request, status, error) {
console.log("code: " + request.status + "\n" + "message: " + request.responseText + "\n" + "error: " + error);
}
});
}
}
// 정보 입력
let deliveryId = '';
let deliveryComName = '';
let deliveryComNum = '';
let deliveryPrice = '';
let deliveryName = '';
let deliveryNum = '';
function getInfo(){
deliveryId = $("input[name='deliveryId']").val();
deliveryComName = $("input[name='deliveryComName']").val();
deliveryComNum = $("input[name='deliveryComNum']").val();
deliveryPrice = $("input[name='deliveryPrice']").val();
deliveryName = $("input[name='deliveryName']").val();
deliveryNum = $("input[name='deliveryNum']").val();
}
// 신규 등록/ 정보 수정
function deli(num){
let url_type = '';
if(num == 1){
url_type = 'deliveryUpdate.mdo';
} else if(num == 2){
url_type = 'deliveryInsert.mdo';
} else {
alert("오류가 발생했습니다. 다시 시도해주세요");
return;
}
getInfo();
$.ajax({
type: "post",
url: url_type,
dataType: "json",
data: {
deliveryId: deliveryId,
deliveryComName: deliveryComName,
deliveryComNum: deliveryComNum,
deliveryPrice: deliveryPrice,
deliveryName: deliveryName,
deliveryNum: deliveryNum
},
success: function(res) {
if(res.code == -1) {
alert(res.message);
return;
}
if(res.code == 1) {
alert(res.message);
window.location.reload();
}
if(res.code == -2) {
alert(res.message);
$("input[name='deliveryId']").val("");
$("input[name='deliveryId']").focus();
return;
}
},
error: function(request, status, error) {
console.log("code: " + request.status + "\n" + "message: " + request.responseText + "\n" + "error: " + error);
}
})
}
// 신규 등록
function newDeli(){
let newDelivery = "";
newDelivery += "<div class='modal-dialog'><div class='modal-content'><div class='modal-header'><h4 class='modal-title'>신규 등록</h4>";
newDelivery += "<button type='button' class='close' data-dismiss='modal' aria-label='Close' onclick='closeModal()'><span aria-hidden='true'>×</span></button></div>";
newDelivery += "<div class='modal-body'><div class='form-group'><label for='exampleInputBorderWidth2'>택배회사번호<code></code></label>";
newDelivery += "<input type='text' name='deliveryId' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' placeholder='택배회사'>";
newDelivery += "</div><div class='form-group'><label for='exampleInputBorderWidth2'>택배회사이름<code></code></label>";
newDelivery += "<input type='text' name='deliveryComName' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' placeholder='택배회사이름'>";
newDelivery += "</div><div class='form-group'><label for='exampleInputBorderWidth2'>택배회사 연락처<code></code></label>";
newDelivery += "<input type='text' name='deliveryComNum' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' placeholder='택배회사 연락처'>";
newDelivery += "</div><div class='form-group'><label for='exampleInputBorderWidth2'>택배비<code></code></label>";
newDelivery += "<input type='text' name='deliveryPrice' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' placeholder='택배비'>";
newDelivery += "</div><div class='form-group'><label for='exampleInputBorderWidth2'>담당자<code></code></label>";
newDelivery += "<input type='text' name='deliveryName' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' placeholder='담당자 이름'>";
newDelivery += "</div><div class='form-group'><label for='exampleInputBorderWidth2'>담당자 연락처<code></code></label>";
newDelivery += "<input type='text' name='deliveryNum' class='form-control form-control-border border-width-2' id='exampleInputBorderWidth2' placeholder='담당자 연락처'>";
newDelivery += "</div></div><div class='modal-footer justify-content-between'><button type='button' class='btn btn-default' data-dismiss='modal' onclick='closeModal()'>취소하기</button>";
newDelivery += "<button type='button' class='btn btn-primary' onclick='deli(2)'>등록하기</button></div></div></div>";
openModel(newDelivery);
}
|
9. modal.js 파일 작성
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
|
/**
*
*/
// 모달 열기
function openModel(content){
document.querySelector("#modal-default").style.display="block";
$(".modal-backdrop").addClass("show");
document.querySelector(".modal-backdrop").style.display="block";
$("#modal-default").html(content);
}
// 모달 닫기
function closeModal(){
document.querySelector(".modal-backdrop").style.display="none";
$(".modal-backdrop").removeClass("show");
document.querySelector("#modal-default").style.display="none";
$("#modal-default").html("");
}
$(document).ready(function(){
// ESC 버튼으로 나가기
$(document).keydown(function(e){
var code = e.keyCode || e.which;
if(code == 27){ // code 27 = ESC
closeModal();
}
});
});
|
>> 실행
>>> 추가 기능
>>> 상세 페이지
>>> 수정 기능
>>> 삭제기능
-- 버튼 클릭 시 한 번 더 묻는 기능을 추가했다.
-- adminLTE3의 가이드 페이지에서는 어두운 부분을 클릭해도 모달을 닫는 기능이 적용되는데, 적용이 되지 않아 ESC 버튼 클릭 시 닫히게 적용시켰다.
reProject_33_ZenBlog 부트스트랩을 사용하여 사용자 화면 작업(메인페이지, 상품 목록 페이지, 상품
reProject_32_배송관리 페이지 작업 2024.01.20 배송관리는 택배사를 관리하는 페이지가 있어야 해서 작업한 기능이다. 택배사 리스트 페이지, 택배사 추가, 수정, 삭제 기능을 구현했다. 따로 상세 페
hyeonga493.tistory.com
반응형
'Project_WEATHERWEAR' 카테고리의 다른 글
| Project_구글 계정으로 이메일 보내기_앱 비밀번호 생성하기 (1) | 2024.01.27 |
|---|---|
| reProject_33_ZenBlog 부트스트랩을 사용하여 사용자 화면 작업(메인페이지, 상품 목록 페이지, 상품 상세 페이지) (1) | 2024.01.27 |
| reProject_31_JSP Spring Excel 저장하기 기능 (1) | 2024.01.26 |
| reProject_30_정렬기능 추가 (0) | 2024.01.24 |
| reProject_29_관리자 주문 관리 페이지 (0) | 2024.01.24 |
'Project_WEATHERWEAR' Related Articles
more
