Explorar o código

Merge branch 'order' into develop

card007 %!s(int64=5) %!d(string=hai) anos
pai
achega
009471da9e
Modificáronse 29 ficheiros con 3919 adicións e 1917 borrados
  1. 12 2
      src/main/java/com/style24/front/biz/dao/TsfOrderChangeDao.java
  2. 12 2
      src/main/java/com/style24/front/biz/service/TsfCartService.java
  3. 52 27
      src/main/java/com/style24/front/biz/service/TsfOrderChangeService.java
  4. 6 4
      src/main/java/com/style24/front/biz/service/TsfOrderService.java
  5. 44 12
      src/main/java/com/style24/front/biz/web/TsfMypageController.java
  6. 14 3
      src/main/java/com/style24/front/biz/web/TsfOrderController.java
  7. 1 0
      src/main/java/com/style24/front/biz/web/TsfPgController.java
  8. 3 1
      src/main/java/com/style24/persistence/mybatis/shop/TsfCart.xml
  9. 97 1
      src/main/java/com/style24/persistence/mybatis/shop/TsfOrderChange.xml
  10. 0 49
      src/main/webapp/WEB-INF/views/mob/cart/CartListFormMob.html
  11. 3 11
      src/main/webapp/WEB-INF/views/mob/pg/kcpOrderMob.html
  12. 269 0
      src/main/webapp/WEB-INF/views/web/cart/CartChangeOptionPopupWeb_20210319.html
  13. 520 321
      src/main/webapp/WEB-INF/views/web/cart/CartListAjaxFormWeb.html
  14. 1019 0
      src/main/webapp/WEB-INF/views/web/cart/CartListAjaxFormWeb_20210319.html
  15. 228 230
      src/main/webapp/WEB-INF/views/web/cart/CartListFormWeb.html
  16. 345 0
      src/main/webapp/WEB-INF/views/web/cart/CartListFormWeb_20210319.html
  17. 607 0
      src/main/webapp/WEB-INF/views/web/mypage/MypageCancelFormWeb.html
  18. 21 19
      src/main/webapp/WEB-INF/views/web/mypage/MypageOrderListFormWeb.html
  19. 6 2
      src/main/webapp/WEB-INF/views/web/order/OrderCustemerInfoWeb.html
  20. 85 146
      src/main/webapp/WEB-INF/views/web/order/OrderDcAmtInfoWeb.html
  21. 286 0
      src/main/webapp/WEB-INF/views/web/order/OrderDcAmtInfoWeb_20210318.html
  22. 37 35
      src/main/webapp/WEB-INF/views/web/order/OrderDeliveryAddrInfoWeb.html
  23. 21 530
      src/main/webapp/WEB-INF/views/web/order/OrderFormWeb.html
  24. 1 126
      src/main/webapp/WEB-INF/views/web/order/OrderFormWeb_20210318.html
  25. 55 55
      src/main/webapp/WEB-INF/views/web/order/OrderFreegiftInfoWeb.html
  26. 70 233
      src/main/webapp/WEB-INF/views/web/order/OrderPaymentInfoWeb.html
  27. 5 0
      src/main/webapp/ux/pc/css/common.css
  28. 54 7
      src/main/webapp/ux/pc/css/layout.css
  29. 46 101
      src/main/webapp/ux/pc/js/mypage.js

+ 12 - 2
src/main/java/com/style24/front/biz/dao/TsfOrderChangeDao.java

@@ -17,15 +17,25 @@ import com.style24.persistence.domain.Point;
 public interface TsfOrderChangeDao {
 
 	/**
-	 * 마이페이지 취소/반품 목록 조회
+	 * 마이페이지 취소 목록 조회
 	 *
 	 * @param Order
 	 * @return Collection<Order>
 	 * @author card007
-	 * @since 2021. 02. 26
+	 * @since 2021. 03. 19
 	 */
 	Collection<Order> getCancelListForMypage(Order order);
 
+	/**
+	 * 마이페이지 반품 목록 조회
+	 *
+	 * @param Order
+	 * @return Collection<Order>
+	 * @author card007
+	 * @since 2021. 02. 26
+	 */
+	Collection<Order> getReturnListForMypage(Order order);
+
 	/**
 	 * 사용 상품권 정보 조회
 	 *

+ 12 - 2
src/main/java/com/style24/front/biz/service/TsfCartService.java

@@ -562,11 +562,21 @@ public class TsfCartService {
 				order.setItemNmArr(order.getItemNm().split("!@!"));
 				order.setOptCdArr(order.getOptCd().split(","));
 				order.setItemQtyArr(order.getItemQtyr().split(","));
+				order.setOptCd1Arr(order.getOptCd1().split(","));
+				order.setOptCd2Arr(order.getOptCd2().split(","));
+				order.setColorNmArr(order.getColorNm().split(","));
 			} else {
-				String[] arr = {order.getItemNm()}, arr2 = {order.getOptCd()}, arr3 = {order.getItemQtyr()};
+				/*String[] arr = {order.getItemNm()}, arr2 = {order.getOptCd()}, arr3 = {order.getItemQtyr()};
 				order.setItemNmArr(arr);
 				order.setOptCdArr(arr2);
-				order.setItemQtyArr(arr3);
+				order.setItemQtyArr(arr3);*/
+
+				String[] arr = {order.getItemNm()}, arr2 = {order.getOptCd1()}, arr3 = {order.getOptCd2()}, arr4 = {order.getItemQtyr()}, arr5 = {order.getColorNm()};
+				order.setItemNmArr(arr);
+				order.setOptCd1Arr(arr2);
+				order.setOptCd2Arr(arr3);
+				order.setItemQtyArr(arr4);
+				order.setColorNmArr(arr5);
 			}
 
 			// 1.3 배송정책별 상품 구분

+ 52 - 27
src/main/java/com/style24/front/biz/service/TsfOrderChangeService.java

@@ -1,6 +1,8 @@
 package com.style24.front.biz.service;
 
+import java.util.ArrayList;
 import java.util.Collection;
+import java.util.List;
 
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
@@ -31,45 +33,68 @@ public class TsfOrderChangeService {
 	private TscOrderChangeService coreOrderChangeService;
 
 	/**
-	 * 마이페이지 취소/반품 목록 조회
+	 * 마이페이지 취소 목록 조회
 	 *
 	 * @param Order
 	 * @return Collection<Order>
 	 * @author card007
-	 * @since 2021. 02. 26
+	 * @since 2021. 03. 19
 	 */
 	public GagaMap getCancelListForMypage(Order order) {
 		GagaMap map = new GagaMap();
-		Boolean shotDelv = false;
-		Boolean selfMall = false;
-		Boolean supplyMall = false;
-		
+
 		Collection<Order> result = orderChangeDao.getCancelListForMypage(order);
-		for (Order tmpOrder : result) {
-			// 총알배송 아이콘 설정
-			if (!shotDelv && "Y".equals(tmpOrder.getShotDelvYn())) {
-				shotDelv = true;
-			}
-
-			// STYLE24 일반배송 아이콘 설정
-			if (!selfMall && "Y".equals(tmpOrder.getSelfGoodsYn())) {
-				selfMall = true;
-			}
-
-			// 업체직배송 아이콘 설정
-			if (!supplyMall && "N".equals(tmpOrder.getSelfGoodsYn())) {
-				supplyMall = true;
-			}
-		}
-		
-		map.set("shotDelv", shotDelv);
-		map.set("selfMall", selfMall);
-		map.set("supplyMall", supplyMall);
-		map.set("oneData", result.iterator().next());
+		Order oneData = result.iterator().next();
+		oneData.setOrdDtlNoArr(getOrdDtlNoArr(result));
+
+		map.set("oneData", oneData);
+		map.set("cancelList", result);
+
+		return map;
+	}
+
+	/**
+	 * 마이페이지 반품 목록 조회
+	 *
+	 * @param Order
+	 * @return Collection<Order>
+	 * @author card007
+	 * @since 2021. 02. 26
+	 */
+	public GagaMap getReturnListForMypage(Order order) {
+		GagaMap map = new GagaMap();
+
+		Collection<Order> result = orderChangeDao.getReturnListForMypage(order);
+		Order oneData = result.iterator().next();
+		oneData.setOrdDtlNoArr(getOrdDtlNoArr(result));
+
+		map.set("oneData", oneData);
 		map.set("returnList", result);
+
 		return map;
 	}
 
+	/**
+	 * 마이페이지 주문상세번호 배열 처리
+	 *
+	 * @param Collection<Order>
+	 * @return int[]
+	 * @author card007
+	 * @since 2021. 03. 19
+	 */
+	private int[] getOrdDtlNoArr(Collection<Order> orderList) {
+		Order order = new Order();
+		List<Integer> ordDtlNoList = new ArrayList<>();
+		
+		for (Order tmp : orderList) {
+			ordDtlNoList.add(tmp.getOrdDtlNo());
+		}
+		
+		order.setOrdDtlNoArr(ordDtlNoList.stream().mapToInt(Integer::intValue).toArray());
+		
+		return ordDtlNoList.stream().mapToInt(Integer::intValue).toArray();
+	}
+
 	/**
 	 * 사용 상품권 정보 조회
 	 *

+ 6 - 4
src/main/java/com/style24/front/biz/service/TsfOrderService.java

@@ -286,11 +286,15 @@ public class TsfOrderService {
 				result.setPayMeans(TscConstants.PayMeans.CREDIT_CARD.value());
 			}
 
+			// 모바일 주문의 경우 result에서 고객 번호 보유중.
+			if(TscConstants.FrontGb.PC.value().equals(TsfSession.getFrontGb())) {
+				result.setUpdNo(param.getCustNo());
+				result.setRegNo(param.getCustNo());
+			}
 			result.setPaySq(param.getPaySq());
-			result.setUpdNo(param.getCustNo());
-			result.setRegNo(param.getCustNo());
 			result.setPayGb("O");
 
+			// TB_PAYMENT 등록. 실패시 PG 환불.
 			if(coreOrderDao.insertPayment(result) < 1) {
 				if(TscConstants.PgGb.KCP.value().equals(param.getPgGb()) || TscConstants.PgGb.PAYCO.value().equals(param.getPgGb())) {
 					coreKcpService.kcpPayRollBack(result, request);
@@ -302,8 +306,6 @@ public class TsfOrderService {
 					throw new IllegalArgumentException("결제 정보 저장 실패. 새로고침 후 다시 시작해주세요.");
 				}
 			}
-
-			coreKcpService.kcpPayRollBack(result, request);
 		} catch(Exception e) {
 			e.printStackTrace();
 			throw new IllegalArgumentException(e.getMessage());

+ 44 - 12
src/main/java/com/style24/front/biz/web/TsfMypageController.java

@@ -457,7 +457,7 @@ public class TsfMypageController extends TsfBaseController {
 	 * @author card007
 	 * @since 2021. 02. 25
 	 */
-	@PostMapping("/cancel/form")
+	@PostMapping("/return/form")
 	@ResponseBody
 	public ModelAndView returnForm(Order order) {
 		ModelAndView mav = new ModelAndView();
@@ -480,13 +480,16 @@ public class TsfMypageController extends TsfBaseController {
 		mav.addObject("customerInfo", customer);
 
 		// 반품 가능 리스트 조회
-		mav.addObject("returnList", orderChangeService.getCancelListForMypage(order));
+		GagaMap map = orderChangeService.getReturnListForMypage(order);
+		Order oneData = (Order) map.get("oneData");
+		mav.addObject("returnList", map);
+		mav.addObject("oneData", oneData);
 
 		// 사용 상품권 정보 조회
-		mav.addObject("usedGiftCardInfo", orderChangeService.getUsedGiftcardInfo(order));
+		mav.addObject("usedGiftCardInfo", orderChangeService.getUsedGiftcardInfo(oneData));
 
 		// 사용 포인트 정보 조회
-		mav.addObject("usedPointInfo", orderChangeService.getUsedPointInfo(order));
+		mav.addObject("usedPointInfo", orderChangeService.getUsedPointInfo(oneData));
 
 		// 주문 결제정보 조회
 		mav.addObject("paymentInfo", orderService.getPaymentInfoForMypage(order));
@@ -502,6 +505,43 @@ public class TsfMypageController extends TsfBaseController {
 		return mav;
 	}
 
+	/**
+	 * 마이페이지 취소신청 화면
+	 *
+	 * @param Order
+	 * @return ModelAndView
+	 * @author card007
+	 * @since 2021. 03. 19
+	 */
+	@PostMapping("/cancel/form")
+	@ResponseBody
+	public ModelAndView cancelForm(Order order) {
+		ModelAndView mav = new ModelAndView();
+
+		// 고객번호 설정
+		int custNo = TsfSession.getInfo().getCustNo();
+		order.setCustNo(custNo);
+
+		// 취소 가능 리스트 조회
+		GagaMap map = orderChangeService.getCancelListForMypage(order);
+		Order oneData = (Order) map.get("oneData");
+		mav.addObject("cancelList", map);
+		mav.addObject("oneData", oneData);
+
+		// 사용 상품권 정보 조회
+		mav.addObject("usedGiftCardInfo", orderChangeService.getUsedGiftcardInfo(oneData));
+
+		// 사용 포인트 정보 조회
+		mav.addObject("usedPointInfo", orderChangeService.getUsedPointInfo(oneData));
+
+		// 주문 결제정보 조회
+		mav.addObject("paymentInfo", orderService.getPaymentInfoForMypage(order));
+
+		mav.setViewName(super.getDeviceViewName("/mypage/MypageCancelForm"));
+
+		return mav;
+	}
+
 	/**
 	 * 마이페이지 STYLE24 포인트화면
 	 *
@@ -514,14 +554,6 @@ public class TsfMypageController extends TsfBaseController {
 	public ModelAndView stylePointForm(Point point) {
 		ModelAndView mav = new ModelAndView();
 
-		// 테스트용 (삭제예정)
-		GagaMap map = new GagaMap();
-		map.setString("custIp", TsfSession.getIpAddress());
-		map.setString("bankNm", "김지철");
-		map.setString("accountNo", "110500288201");
-		map.setString("bankCd", "88");
-		// 테스트용 (삭제예정)
-
 		int custNo = TsfSession.getInfo().getCustNo();
 		point.setCustNo(custNo);
 		// 잔여포인트

+ 14 - 3
src/main/java/com/style24/front/biz/web/TsfOrderController.java

@@ -249,12 +249,23 @@ public class TsfOrderController extends TsfBaseController {
 			// 2.1 주문고객 정보조회
 			deliveryAddrInfo = coreOrderService.getDeliveryAddrInfo(order);
 			
-			if (deliveryAddrInfo == null) {
-				deliveryAddrInfo = new Order();
+			if (deliveryAddrInfo.getDelvAddrNm() == null || "".equals(deliveryAddrInfo.getDelvAddrNm())) {
 				deliveryAddrInfo.setDelvAddrNm(deliveryAddrInfo.getCustNm());
+			}
+			
+			if (deliveryAddrInfo.getRecipZipcode() == null || "".equals(deliveryAddrInfo.getRecipZipcode())) {
 				deliveryAddrInfo.setRecipZipcode("00000");
+			}
+			
+			if (deliveryAddrInfo.getRecipBaseAddr() == null || "".equals(deliveryAddrInfo.getRecipBaseAddr())) {
 				deliveryAddrInfo.setRecipBaseAddr("기본주소정보없음");
-				deliveryAddrInfo.setRecipDtlAddr("상제주소정보없음");
+			}
+			
+			if (deliveryAddrInfo.getRecipDtlAddr() == null || "".equals(deliveryAddrInfo.getRecipDtlAddr())) {
+				deliveryAddrInfo.setRecipDtlAddr("상세주소정보없음");
+			}
+			
+			if (deliveryAddrInfo.getDelvMemo() == null || "".equals(deliveryAddrInfo.getDelvMemo())) {
 				deliveryAddrInfo.setDelvMemo("직접받고 부재시 문 앞");
 			}
 		} else {

+ 1 - 0
src/main/java/com/style24/front/biz/web/TsfPgController.java

@@ -154,6 +154,7 @@ public class TsfPgController extends TsfBaseController {
 		}
 
 		param.setUpdNo(param.getCustNo());
+		param.setFrontGb(TsfSession.getFrontGb());
 
 		// 2. 결재정보등록(TB_PAYMENT)
 		param = orderService.orderPgPayResult(param, request, response);

+ 3 - 1
src/main/java/com/style24/persistence/mybatis/shop/TsfCart.xml

@@ -497,6 +497,7 @@
 		SELECT GROUP_CONCAT(Z.ITEM_NM ORDER BY Z.CART_DTL_SQ SEPARATOR '!@!') AS ITEM_NM
 			 , GROUP_CONCAT(Z.ITEM_CD ORDER BY Z.CART_DTL_SQ) AS ITEM_CD
 			 , GROUP_CONCAT(Z.OPT_CD ORDER BY Z.CART_DTL_SQ) AS OPT_CD
+			 , GROUP_CONCAT(Z.COLOR_NM ORDER BY Z.CART_DTL_SQ) AS COLOR_NM
 			 , GROUP_CONCAT(Z.OPT_CD1 ORDER BY Z.CART_DTL_SQ) AS OPT_CD1
 			 , GROUP_CONCAT(Z.OPT_CD2 ORDER BY Z.CART_DTL_SQ) AS OPT_CD2
 			 , GROUP_CONCAT(Z.ITEM_QTY ORDER BY Z.CART_DTL_SQ) AS ITEM_QTYR
@@ -523,7 +524,8 @@
 					 , CD.OPT_CD
 					 , CD.ITEM_QTY
 					 , CD.CART_DTL_SQ
-					 , O.OPT_CD1
+					 , (SELECT COLOR_KNM FROM TB_COLOR C WHERE COLOR_CD = IFNULL(NULLIF(O.OPT_CD1,'') , G.MAIN_COLOR_CD ) AND USE_YN  = 'Y') AS COLOR_NM
+		             , O.OPT_CD1
 					 , O.OPT_CD2
 					 , G.GOODS_TYPE
 					 , G.SUPPLY_COMP_CD

+ 97 - 1
src/main/java/com/style24/persistence/mybatis/shop/TsfOrderChange.xml

@@ -15,9 +15,105 @@
 	</sql>
 	<!--// Paging -->
 
-	<!-- 마이페이지 취소/반품 목록 조회 -->
+	<!-- 마이페이지 취소 목록 조회 -->
 	<select id="getCancelListForMypage" parameterType="Order" resultType="Order">
 		/* TscOrderChange.getCancelListForMypage */
+		SELECT O.ORD_NO
+		     , DATE_FORMAT(O.ORD_DT, '%Y.%m.%d')				AS ORD_DT
+		     , O.CUST_NO
+		     , OD.ORD_DTL_NO
+		     , OD.ORD_DTL_STAT
+		     , FN_GET_CODE_NM('G013', OD.ORD_DTL_STAT)			AS ORD_DTL_STAT_NM
+		     , OD.ORD_EXCH_GB
+		     , CASE WHEN OD.ORD_DTL_STAT IN ('G013_20', 'G013_30', 'G013_40') THEN 'Y'
+					ELSE 'N'
+				END												AS ALL_CAN_YN
+		     , OD.GOODS_CD
+		     , G1.GOODS_NM
+		     , G1.GOODS_TYPE
+		     , FN_GET_CODE_NM('G056', G1.GOODS_TYPE)			AS GOODS_TYPE_NM
+		     , G2.GOODS_CD										AS ITEM_CD
+		     , G2.GOODS_NM										AS ITEM_NM
+		     , ODI.ORD_DTL_ITEM_SQ
+		     , ODI.OPT_CD
+		     , ODI.OPT_CD1
+		     , ODI.OPT_CD2
+		     , ODI.ITEM_QTY
+		     , ODI.ITEM_PRICE
+		     , ODI.OPT_ADD_PRICE
+		     , ODI.ORD_AMT
+		     , ODI.CNCL_RTN_AMT
+		     , ODI.CPN1_DC_AMT
+		     , ODI.TMTB1_DC_AMT
+		     , ODI.TMTB2_DC_AMT
+		     , ODI.GOODS_CPN_DC_AMT
+		     , ODI.CART_CPN_DC_AMT
+		     , ODI.PNT_DC_AMT
+		     , ODI.PRE_PNT_DC_AMT
+		     , ODI.GFCD_USE_AMT
+		     , ODI.REAL_ORD_AMT
+		     , GI.SYS_IMG_NM
+		     , OD.ORD_QTY
+		     , OD.CNCL_RTN_QTY
+		     , CASE WHEN OCD.ORD_REQ_CHG_QTY IS NULL THEN 0
+					ELSE OCD.ORD_REQ_CHG_QTY * ODI.ITEM_QTY
+				END												AS ORD_REQ_CHG_QTY
+		     , OD.ORD_QTY - OD.CNCL_RTN_QTY - IF(OCD.ORD_REQ_CHG_QTY IS NULL, 0, OCD.ORD_REQ_CHG_QTY * ODI.ITEM_QTY) AS ORD_CAN_CHG_QTY
+		     , OD.SAVE_PNT_AMT
+		     , OD.SHIP_COMP_CD
+		     , OD.GIFT_PACK_YN
+		     , FN_GET_SUPPLY_COMP_NM(OD.SUPPLY_COMP_CD)			AS SUPPLY_COMP_NM
+		     , OD.INVOICE_NO
+		     , OD.SUPPLY_COMP_CD
+		     , OD.DELV_FEE_CD
+		     , OD.SHOT_DELV_YN
+		     , G1.SELF_GOODS_YN
+		     , CONCAT(B.BRAND_ENM, ' ', B.BRAND_KNM)			AS BRAND_NM
+		  FROM TB_ORDER O
+		 INNER JOIN TB_ORDER_DETAIL OD
+		    ON O.ORD_NO = OD.ORD_NO
+		 INNER JOIN TB_ORDER_DETAIL_ITEM ODI
+		    ON OD.ORD_NO = ODI.ORD_NO
+		   AND OD.ORD_DTL_NO = ODI.ORD_DTL_NO
+		 INNER JOIN TB_GOODS G1
+		    ON OD.GOODS_CD = G1.GOODS_CD
+		 INNER JOIN TB_GOODS G2
+		    ON ODI.ITEM_CD = G2.GOODS_CD
+		 INNER JOIN TB_BRAND B
+		    ON B.BRAND_CD = G1.BRAND_CD
+		  LEFT OUTER JOIN (SELECT OD.ORD_DTL_NO
+								, SUM(OCD.CHG_QTY) AS ORD_REQ_CHG_QTY
+							 FROM TB_ORDER_CHANGE_DETAIL OCD
+							INNER JOIN TB_ORDER_DETAIL OD
+							   ON OCD.ORD_DTL_NO = OD.ORD_DTL_NO
+							WHERE OD.ORD_NO = #{ordNo}
+							  AND OCD.DEL_YN = 'N'
+							  AND OCD.CHG_STAT IN ('G685_20', 'G685_30', 'G685_33', 'G685_40')
+							GROUP BY OCD.ORD_DTL_NO
+						  ) OCD
+		    ON OD.ORD_DTL_NO = OCD.ORD_DTL_NO
+		  LEFT OUTER JOIN TB_GOODS_IMG GI
+		    ON OD.GOODS_CD = GI.GOODS_CD
+		   AND ODI.OPT_CD1 = GI.COLOR_CD
+		   AND GI.DEFAULT_IMG_YN = 'Y'
+		 WHERE O.ORD_NO = #{ordNo}
+		   AND OD.ORD_DTL_STAT IN ('G013_10', 'G013_11', 'G013_20', 'G013_30')
+		<choose>
+			<when test='custNo != null and custNo != ""'>
+		   AND O.CUST_NO = #{custNo}
+			</when>
+			<otherwise>
+		   AND O.ORD_NO = #{ordNo}
+		   AND O.ORD_NM = #{orderNm}
+			</otherwise>
+		</choose>
+		   AND O.DISP_YN = 'Y'
+		 ORDER BY OD.ORD_DTL_NO
+	</select>
+
+	<!-- 마이페이지 반품 목록 조회 -->
+	<select id="getReturnListForMypage" parameterType="Order" resultType="Order">
+		/* TscOrderChange.getReturnListForMypage */
 		SELECT O.ORD_NO
 		     , DATE_FORMAT(O.ORD_DT, '%Y.%m.%d')				AS ORD_DT
 		     , OD.ORD_DTL_NO

+ 0 - 49
src/main/webapp/WEB-INF/views/mob/cart/CartListFormMob.html

@@ -9,55 +9,6 @@
 
 <th:block layout:fragment="content">
 
-<script type="text/javascript" th:src="${@environment.getProperty('pg.kcp.js.url')}" src=""></script>
-<script type="text/javascript" src="/ux/mo/js/payment.js"></script>
-<script type="text/javascript">
-	$(document).on("click", "#buyBtn", function() {
-		let orderData = {
-			pgGb		: "KCP"
-			, payMeans	: "G014_10"
-			, ordNo		: "5"
-			, goodsNm	: "상품 테스트"
-			, payAmt	: "1233"
-			, ordNm		: "이태영"
-			, ordEmail	: "xodud1202@naver.com"
-			, ordTelno	: "02-0000-0000"
-			, ordPhnno	: "010-7111-0000"
-		};
-
-		let jsonData = JSON.stringify(orderData);
-
-		$.ajax( {
-			type		: "POST",
-			url			: '/order/create/preOrder',
-			data		: jsonData,
-			dataType	: 'html',
-			beforeSend : function(xhr, settings) {
-				xhr.setRequestHeader("AJAX"			, "true");
-				xhr.setRequestHeader('Accept'		, 'application/json');
-				xhr.setRequestHeader('Content-Type'	, 'application/json');
-				gagajf.showProgressbar(true);
-			},
-			error : function(e) {
-				alert(3);
-			},
-			success 	: function(result) {
-				// 결재정보로드
-				$("#orderInfo").html(result);
-				kcp_AJAX();
-				//jsf__pay(document.order_info);
-				//fnKakaoPaymentReady();
-				//fnNaverPaymentReady();
-			}
-		});
-	});
-</script>
-
-
-
-
-<div id="orderInfo" name="orderInfo"></div>
-<input type="button" id="buyBtn" value="KCP TEST" style="width:100px;height:200px;" />
 
 </th:block>
 

+ 3 - 11
src/main/webapp/WEB-INF/views/mob/pg/kcpOrderMob.html

@@ -16,7 +16,6 @@
 	<input type="hidden" name="payMeans"		th:value="${payment.payMeans}" />
 
 	<input type="hidden" name="encoding_trans"	value="UTF 8" />	<!-- 추가 인코딩 네임은 대문자 -->
-	<input type="hidden" name="PayUrl"			value="" />			<!-- 주문페이지 소스에 이미 PayUrl 이 input 값에 있다면 추가하지 않습니다 -->
 
 	<input type="hidden" name="req_tx"			th:value="${payment.reqTx}" />		<!-- 요청의 종류를 구분하는 변수 결제요청페이지의 경우 ‘pay’로 설정 -->
 	<input type="hidden" name="shop_name"		th:value="${payment.siteName}" />	<!-- 상점이름(영문으로 작성권장) -->
@@ -50,16 +49,12 @@
 	<input type="hidden" name="use_pay_method"	value=""/>
 	<input type="hidden" name="cash_yn"         value=""/>
 	<input type="hidden" name="cash_tr_code"	value=""/>
-
-
-
+	<input type="hidden" name="param_opt_1"		th:value="${payment.pgGb}" />		<!-- 모바일은 URL 로 변수 이동하므로 추가 변수로 KCP인지 PAYCO인지 송부 -->
+	<input type="hidden" name="param_opt_2"		th:value="${payment.shopUserId}" />	<!-- 모바일은 URL 로 변수 이동하므로 추가 변수로 custNo 송부 -->
 
 	<input type="hidden" name="shop_user_id"	th:value="${payment.shopUserId}" />	<!-- 필수, 쇼핑몰회원ID 기관에 따라 RM 조치를 위해 쇼핑몰 관리 ID를 필수로 요청 -->
 
 
-
-
-
 	<!-- 신용카드 정보 -->
 
 
@@ -70,7 +65,7 @@
 	<input type="hidden" name="tablet_size"     value="<%=tablet_size%>">
 
 	<!-- 무통장입금 정보 -->
-	<!-- <input type="hidden" name="vcnt_expire_term"	th:value="${payment.vcntExpireTerm}"/> -->	<!-- 무통장입금 유효기간 설정 (3 = 3일) -->
+	<input type="hidden" name="vcnt_expire_term"	th:value="${payment.vcntExpireTerm}"/>	<!-- 무통장입금 유효기간 설정 (ex. 3 = 3일) -->
 
 	<!-- 2012년 8월 18일 전자상거래법 개정 관련 설정 부분 -->
 	<!-- 제공 기간 설정 0:일회성 1:기간설정(ex 1:2012010120120131)  -->
@@ -84,12 +79,9 @@
 			필수 항목 : 표준웹에서 값을 설정하는 부분으로 반드시 포함되어야 합니다
 			값을 설정하지 마십시오
 	-->
-
-
 	<input type="hidden" name="ret_pay_method"  value=""/>
 	<input type="hidden" name="tran_cd"         value=""/>
 
-
 	<!-- 주문정보 검증 관련 정보 : 표준웹 에서 설정하는 정보입니다 -->
 	<input type="hidden" name="ordr_chk"        value=""/>
 

+ 269 - 0
src/main/webapp/WEB-INF/views/web/cart/CartChangeOptionPopupWeb_20210319.html

@@ -0,0 +1,269 @@
+<html lang="ko"
+	  xmlns:th="http://www.thymeleaf.org">
+<!-- 옵션변경 팝업 -->
+<div class="modal-dialog cartOptionModal" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="optModifyLabel">옵션변경</h5>
+			<div class="prod_title">
+				<span class="brand" th:text="|${cart.brandEnm + ' ' + cart.brandKnm}|"></span>
+				<span class="name" th:text="${cart.goodsNm}"></span>
+			</div>
+		</div>
+
+		<div class="modal-body">
+			<div class="pop_cont">
+				<div class="prod_info">
+					<div class="prod_preview">
+						<div class="area_pic">
+							<ul class="pic_list">
+								<th:block th:if="${setType.equals(cart.goodsType) or cart.selfGoodsYn.equals('N')}">
+									<li th:each="img, index : ${cart.cartImgList}">
+										<span class="thumb"><img th:src="${cart.imgPath + '/' + img.sysImgNm}" src="#" alt="" /></span>
+									</li>
+								</th:block>
+								<th:block th:if="${!setType.equals(cart.goodsType) and cart.selfGoodsYn.equals('Y')}">
+									<th:block th:each="comp, status : ${cart.cartCompsList}">
+										<th:block th:each="color, index : ${comp.cartColorList}">
+											<th:block th:if="${color.cartOptCd1 != null and color.cartOptCd1.equals(color.optCd1)}">
+												<li th:each="img, index : ${color.cartImgList}">
+													<span class="thumb"><img th:src="${cart.imgPath + '/' + img.sysImgNm}" src="#" alt="" /></span>
+												</li>
+											</th:block>
+										</th:block>
+									</th:block>
+								</th:block>
+							</ul>
+						</div>
+						<div class="area_order">
+							<th:block th:each="comp, status : ${cart.cartCompsList}">
+								<!-- 세트상품 옵션 -->
+								<th:block th:if="${setType.equals(cart.goodsType)}">
+									<div class="opt_select setOption">
+										<div class="opt_header">
+											<span class="title" th:text="${comp.goodsNm}"></span>
+										</div>
+
+										<!-- 컬러 변경시 만들어줄 size option -->
+										<th:block th:each="color, index : ${comp.cartColorList}">
+											<span style="display:none;">
+												<select th:classappend="|color_${color.goodsCd}_${color.optCd1}|">
+													<th:block th:each="size, i : ${color.cartSizeList}">
+														<th:block th:if="${color.optCd1.equals(size.optCd1)}">
+															<option th:value="${size.optCd}" th:text="${size.optCd2}"></option>
+														</th:block>
+													</th:block>
+												</select>
+											</span>
+										</th:block>
+
+										<div class="form_field">
+											<select class="setColorSelect">
+												<th:block th:each="color, index : ${comp.cartColorList}">
+													<option th:data="${comp.goodsCd}" th:value="${color.optCd1}" rel="icon-temperature" th:text="${color.colorNm}" th:selected="${color.cartColorNm != null}"></option>
+												</th:block>
+											</select>
+										</div>
+										<div class="form_field">
+											<th:block th:each="color, index : ${comp.cartColorList}">
+											<select th:data="${color.goodsCd}" th:class="|size_${comp.goodsCd} setSizeSelect|">
+												<th:block th:each="size, i : ${color.cartSizeList}">
+													<th:block th:if="${color.optCd1.equals(size.optCd1)}">
+														<option th:data="${comp.cartDtlSq}" th:value="${size.optCd}" th:text="${size.optCd2}" th:selected="${size.cartOptCd != null}"></option>
+													</th:block>
+												</th:block>
+											</select>
+											</th:block>
+										</div>
+									</div>
+								</th:block>
+
+								<!-- 자사 일반 상품 옵션 -->
+								<th:block th:if="${!setType.equals(cart.goodsType) and 'Y'.equals(cart.selfGoodsYn)}">
+									<div class="opt_color">
+										<div class="opt_header">
+											<span class="title">컬러</span>
+											<th:block th:each="color, index : ${comp.cartColorList}">
+												<th:block th:if="${color.cartColorNm != null}">
+													<span class="color" th:text="${color.cartColorNm}"></span>
+												</th:block>
+											</th:block>
+										</div>
+										<ul>
+											<li th:each="color, index : ${comp.cartColorList}" class="selfGoodsColor">
+												<a href="" th:cartDtlSq="${color.cartDtlSq}" th:classappend="${color.cartColorNm != null} ? 'on'" class="selfGoodsColorSelect" th:data="${color.optCd1}">
+													<img th:src="${cart.imgPath + '/' + color.sysImgNm}" src="#" th:alt="${color.colorNm}" alt="" />
+												</a>
+											</li>
+										</ul>
+									</div>
+
+									<div class="opt_size">
+										<div class="opt_header">
+											<span class="title">사이즈</span>
+										</div>
+										<div class="form_field selfGoodsSize">
+											<th:block th:each="color, index : ${comp.cartColorList}">
+												<th:block th:if="${color.cartColorNm != null}">
+													<th:block th:each="size, index : ${color.cartSizeList}">
+														<div>
+															<input type="radio" name="rdi-optsize" th:id="|${'rdi-optsize' + size.goodsCd + '-' + size.optCd}|" th:value="${size.optCd}" th:checked="${size.cartOptCd != null}" th:disabled="${size.soldoutYn == 'Y' or cart.goodsQty > size.currStockQty}">
+															<label th:for="|${'rdi-optsize' + size.goodsCd + '-' + size.optCd}|"><span th:text="${size.optCd2}"></span></label>
+														</div>
+													</th:block>
+												</th:block>
+											</th:block>
+										</div>
+									</div>
+								</th:block>
+
+								<!-- 입점업체 상품 옵션 -->
+								<th:block th:if="${!setType.equals(cart.goodsType) and !'Y'.equals(cart.selfGoodsYn)}">
+									<div class="opt_select">
+										<div class="opt_header">
+											<span class="title">옵션선택</span>
+										</div>
+										<div class="form_field">
+											<select class="selfGoodsColor">
+												<th:block th:each="color, index : ${comp.cartColorList}">
+												<option th:data="${color.cartDtlSq}" th:value="${color.optCd}" th:text="${color.optCd1 + '/' + color.optCd2}" th:selected="${color.cartOptCd != null}"></option>
+												</th:block>
+											</select>
+										</div>
+									</div>
+								</th:block>
+							</th:block>
+							<div class="opt_count">
+								<div class="opt_header">
+									<span class="title">수량</span>
+								</div>
+								<div class="number_count">
+									<span class="minus"><span class="sr-only">감소</span></span>
+									<input type="text" name="goodsQty" maxlength="3" style='ime-mode:disabled' th:value="${cart.goodsQty}" />
+									<!-- <input type="text" name="goodsQty" maxlength="3" style='ime-mode:disabled' th:value="2" /> -->
+									<span class="plus"><span class="sr-only">추가</span></span>
+								</div>
+							</div>
+							<div class="btn_group_block">
+								<button class="btn btn_dark btn_block" th:onclick="|fnChangeCartOption(${cart.cartSq})|"><span>옵션변경</span></button>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+<!-- //옵션변경 팝업 -->
+
+
+<script th:inline="javascript">
+	// 세트상품 컬러 변경시
+	$(".setColorSelect").on("change", function(e) {
+		let goodsCd = $(this).find("option:checked").attr("data");
+		$(".setOption .size_" + goodsCd).html("");
+		$(".setOption .size_" + goodsCd).html($(".color_" + goodsCd + "_" + $(this).val()).html());
+	});
+
+	// 자사 일반 상품 컬러 선택시
+	$(".selfGoodsColorSelect").on("click", function(e) {
+		let html = "";
+		let cart = [[${cart}]];
+		let color =  [[${cart.cartCompsList[0].cartColorList}]];
+		let optCd1 = $(this).attr("data");
+
+		for(let i = 0 ; i < color.length ; i++) {
+			let size = color[i].cartSizeList;
+			for(let j = 0 ; j < size.length ; j++) {
+				if(optCd1 == size[j].optCd1) {
+					html += "<div>";
+					html += "<input type='radio' name='rdi-optsize' id='" + size[j].goodsCd + "-" + size[j].optCd + "' value='" + size[j].optCd + "' ";
+					if(size[j].soldoutYn == "Y" || cart.goodsQty > size[j].currStockQty) {
+						html += "disabled = 'disabled'";
+					}
+					html += " />\n";
+					html += "<label for='" + size[j].goodsCd + "-" + size[j].optCd + "'><span>" + size[j].optCd2 + "</span></label>\n"
+					html += "</div>\n";
+				}
+			}
+		}
+
+		$(".selfGoodsSize").html(html);
+	});
+
+	function fnChangeCartOption(cartSq) {
+		let cart = [[${cart}]];
+		let cartDtlSqArr = [], itemCds = [], optCds = [];
+		let data;
+
+		if(cart.goodsType == "G056_S") {
+			$(".setSizeSelect").each(function() {
+				optCds.push($(this).val());
+				itemCds.push($(this).attr("data"));
+				cartDtlSqArr.push($(this).find("option:checked").attr("data"));
+			});
+
+			data = {
+				  cartSq : cart.cartSq
+				, goodsCd : cart.goodsCd
+				, goodsType : cart.goodsType
+				, cartDtlSqArr : cartDtlSqArr
+				, itemCds : itemCds
+				, optCds : optCds
+				, goodsQty : $("input[name=goodsQty]").val()
+			}
+		} else if(cart.goodsType != "G056_S" && cart.selfGoodsYn == "Y") {
+			optCds.push($(".selfGoodsSize").find("input[name=rdi-optsize]:checked").val());
+			itemCds.push(cart.goodsCd);
+			$(".selfGoodsColorSelect").each(function() {
+				if($(this).attr("cartDtlSq") > 0) {
+					cartDtlSqArr.push($(this).attr("cartDtlSq"));
+				}
+			});
+
+			data = {
+				  cartSq : cart.cartSq
+				, goodsCd : cart.goodsCd
+				, goodsType : cart.goodsType
+				, cartDtlSqArr : cartDtlSqArr
+				, itemCds : itemCds
+				, optCds : optCds
+				, goodsQty : $("input[name=goodsQty]").val()
+			}
+		} else {
+			optCds.push($(".selfGoodsColor").val());
+			itemCds.push(cart.goodsCd);
+			$(".selfGoodsColor option").each(function() {
+				if($(this).attr("data") > 0) {
+					cartDtlSqArr.push($(this).attr("data"));
+				}
+			});
+
+			data = {
+				cartSq : cart.cartSq
+				, goodsCd : cart.goodsCd
+				, goodsType : cart.goodsType
+				, cartDtlSqArr : cartDtlSqArr
+				, itemCds : itemCds
+				, optCds : optCds
+				, goodsQty : $("input[name=goodsQty]").val()
+			}
+		}
+
+		$.ajax( {
+			type: "POST",
+			url : '/cart/change/option',
+			contentType: 'application/json',
+			dataType : 'json',
+			data : JSON.stringify(data),
+			success : function(result) {
+				alert(result.message);
+				$(".closeCartOptionModal").trigger("click");
+				getCartList();
+			}
+		});
+	}
+</script>
+
+</div>
+<a href="#close-modal" rel="modal:close" class="close-modal closeCartOptionModal">Close</a>
+</html>

+ 520 - 321
src/main/webapp/WEB-INF/views/web/cart/CartListAjaxFormWeb.html

@@ -5,11 +5,11 @@
 
 	<!-- CONT-BODY -->
 	<div class="od_cont">
-		<div class="sec_head shotDelvSelect">
+		<div class="sec_head">
 			<div class="tbl type4">
 				<table>
 					<colgroup>
-						<col width="150">
+						<col width="170">
 						<col width="*">
 					</colgroup>
 					<tbody>
@@ -21,7 +21,7 @@
 							<div class="form_field">
 								<div>
 									<input type="radio" name="shotDelvUseYn" id="blt_ship1" value="Y" th:checked="${order.shotCanYn.equals('Y')}">
-									<label for="blt_ship1"><span><em class="tag">총알배송</em><span th:text="|${order.shotDelvDt}일 24:00 까지 도착|"></span></span></label>
+									<label for="blt_ship1"><span><em class="tag primary_line">총알배송</em><span th:text="|${order.shotDelvDt}일 24:00 까지 도착|"></span></span></label>
 								</div>
 								<div>
 									<input type="radio" name="shotDelvUseYn" id="blt_ship2" value="N" th:checked="${!order.shotCanYn.equals('Y')}">
@@ -35,277 +35,534 @@
 			</div>
 		</div>
 		<div class="sec_body">
-			<!-- 총알배송 -->
-			<div class="part_deliver wmsList" th:if="${wmsCartList != null and wmsCartList.size() > 0}">
-				<h3 class="subH2 mb20" th:if="${order.shotCanYn.equals('Y')}">
-					STYLE24 총알배송
-					<span class="ml10">오늘 자정까지 도착</span>
-				</h3>
-				<h3 class="subH2 mb20" th:if="${order.shotCanYn.equals('N')}">
-					STYLE24 일반배송
-				</h3>
-				<div class="tbl type2">
-					<table>
-						<colgroup>
-							<col width="900">
-							<col width="*">
-						</colgroup>
-						<tbody>
-						<th:block th:each="cart, status : ${wmsCartList}">
-							<tr class="cartInfo wmsCartInfo">
-								<input type="hidden" name="applyQtySectionYn" th:value="${cart.applyQtySectionYn}" />
-								<input type="hidden" name="applyAmtSectionYn" th:value="${cart.applyAmtSectionYn}" />
-								<input type="hidden" name="qtyTmtbSq" th:value="${cart.qtyTmtbSq}" />
-								<input type="hidden" name="qtyTmtbNm" th:value="${cart.qtyTmtbNm}" />
-								<input type="hidden" name="amtTmtbSq" th:value="${cart.amtTmtbSq}" />
-								<input type="hidden" name="amtTmtbNm" th:value="${cart.amtTmtbNm}" />
-								<input type="hidden" name="currPrice" th:value="${cart.currPrice}" />
-								<input type="hidden" name="soldoutYn" th:value="${cart.soldoutYn}" />
-								<input type="hidden" name="tmtbDcAmt" th:value="${cart.tmtbDcAmt}" />
-								<input type="hidden" name="cartSq" th:value="${cart.cartSq}" />
-
-								<td>
-									<!-- 주문가능 상품 -->
-									<div class="info_item" th:classappend="${cart.soldoutYn.equals('Y')} ? unable"> <!-- 주문불가시 class="unable" 추가 / 인풋, 버튼 disable 처리 -->
-										<div class="form_box">
-											<p class="form_field">
-												<input th:id="|od_item_${cart.cartSq}|" name="cartSqArr" type="checkbox" th:value="${cart.cartSq}" th:checked="${cart.soldoutYn.equals('N')}" th:disabled="${cart.soldoutYn.equals('Y')}"/>
-												<label th:for="|od_item_${cart.cartSq}|">
-													<span class="sr-only">상품선택</span>
-												</label>
-											</p>
+			<form class="form_wrap">
+				<div class="sec_select">
+					<div>
+						<div class="form_field">
+							<input id="od_item_all" type="checkbox"><label for="od_item_all"><span>전체선택</span></label>
+						</div>
+						<button type="button" class="btn btn_default btn_sm"><span>선택삭제</span></button>
+					</div>
+				</div>
+				<div class="sec_part">
+					<h3 class="subH2">
+						STYLE24 배송
+					</h3>
+					<div class="area_part">
+						<h4 class="subH2">
+							총알배송
+							<span class="tit_info">오늘 자정까지 도착</span>
+						</h4>
+						<div class="part_goods">
+							<div class="goods_cont">
+								<!-- 주문상품 -->
+								<th:block th:each="cart, status : ${wmsCartList}">
+									<div class="cartInfo goods_info wmsCartInfo">
+										<input type="hidden" name="applyQtySectionYn" th:value="${cart.applyQtySectionYn}" />
+										<input type="hidden" name="applyAmtSectionYn" th:value="${cart.applyAmtSectionYn}" />
+										<input type="hidden" name="qtyTmtbSq" th:value="${cart.qtyTmtbSq}" />
+										<input type="hidden" name="qtyTmtbNm" th:value="${cart.qtyTmtbNm}" />
+										<input type="hidden" name="amtTmtbSq" th:value="${cart.amtTmtbSq}" />
+										<input type="hidden" name="amtTmtbNm" th:value="${cart.amtTmtbNm}" />
+										<input type="hidden" name="currPrice" th:value="${cart.currPrice}" />
+										<input type="hidden" name="soldoutYn" th:value="${cart.soldoutYn}" />
+										<input type="hidden" name="tmtbDcAmt" th:value="${cart.tmtbDcAmt}" />
+										<input type="hidden" name="cartSq" th:value="${cart.cartSq}" />
+
+										<div class="order_desc">
+											<div class="form_box">
+												<div class="form_field">
+													<input th:id="|od_item_${cart.cartSq}|" name="cartSqArr" type="checkbox" th:value="${cart.cartSq}" th:checked="${cart.soldoutYn.equals('N')}" th:disabled="${cart.soldoutYn.equals('Y')}"/>
+													<label th:for="|od_item_${cart.cartSq}|">
+														<span class="sr-only">상품선택</span>
+													</label>
+												</div>
+											</div>
+											<div class="goods_box">
+												<div class="gd_item">
+													<a href="">
+														<span class="thumb">
+															<img th:src="${IMG_PATH} + '/' + ${cart.sysImgNm}" src="/" width="100%" alt="">
+														</span>
+														<p>
+															<span class="brand" th:text="|${cart.brandEnm} ${cart.brandKnm}|"></span>
+														</p>
+														<p>
+															<span class="name" th:text="${cart.goodsNm}"></span>
+														</p>
+													</a>
+												</div>
+												<div class="gd_opt">
+													<div class="option_wrap">
+														<span class="title sr-only">주문 옵션</span>
+														<th:block th:each="opt, index : ${cart.itemNmArr}">
+															<th:block th:if="${cart.goodsType.equals('G056_S')}">
+																<span class="option" th:text="${cart.itemNmArr[index.index]} + ' / ' + ${cart.colorNmArr[index.index]} + ' / ' + ${cart.optCd2Arr[index.index]}"></span>
+															</th:block>
+															<th:block th:if="${!cart.goodsType.equals('G056_S')}">
+																<span class="option" th:text="${cart.colorNmArr[index.index]} + ' / ' + ${cart.optCd2Arr[index.index]}"></span>
+															</th:block>
+														</th:block>
+													</div>
+												</div>
+												<div class="gd_calc">
+													<p>
+														<span class="count">수량&nbsp;<em th:text="${cart.goodsQty}"></em>개</span>
+													</p>
+												</div>
+												<div class="gd_exinfo">
+													<p th:if="${!#strings.isEmpty(cart.delvResDt)}"><span class="tag primary_line">총알배송</span><span th:text="|${cart.delvResDt} 배송예정|">2020.12.25 배송예정</span></p>
+													<p th:if="${(cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'Y') or (cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y')}"><span class="tag primary">SALE</span>다다익선 할인 적용</p>
+												</div>
+											</div>
+											<div class="calc_box">
+												<th:block  th:if="${cart.tmtbDcAmt < cart.currPrice}">
+													<p><span class="price_org"><em th:text="${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')}"></em>원</span></p>
+													<p><span class="price_sale"><em th:text="${#numbers.formatInteger(cart.tmtbDcAmt, 1, 'COMMA')}"></em>원</span></p>
+												</th:block>
+												<th:block th:if="${cart.tmtbDcAmt == cart.currPrice}">
+													<p><span class="price_sale"><em th:text="${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')}"></em>원</span></p>
+												</th:block>
+												<p>
+													<span class="point">
+														<em th:text="${#numbers.formatInteger(cart.savePntAmt, 1, 'COMMA')}"></em><stong>P</stong>&nbsp;적립예정
+													</span>
+												</p>
+											</div>
+											<div class="button_box">
+												<p th:if="${cart.soldoutYn.equals('Y')}"><button type="button" class="btn btn_dark btn_sm" disabled=""><span>구매 불가</span></button></p>
+												<p th:if="${cart.soldoutYn.equals('N')}"><button type="button" class="btn btn_primary btn_sm" th:onclick="|fnSubmitNoMember(${cart.cartSq})|"><span>바로 구매</span></button></p>
+
+												<p><button type="button" id="btn_opt_modify1" class="btn btn_default btn_sm" th:onclick="|fnChangeCartOptCd(${cart.cartSq})|"><span>옵션 / 수량 변경</span></button></p>
+												<div class="util">
+													<span>
+														<button type="button" class="btn_favorite" th:classappend="${cart.wishCnt > 0} ? active" onclick="cfnPutWishList(this)" th:goodsCd="${cart.goodsCd}" th:ithrCd="${cart.ithrCd}" th:contentsLoc="${cart.contentsLoc}">
+															<span><i class="ico ico_like2"></i><em class="sr-only">관심상품 추가</em></span>
+														</button>
+													</span>
+													<span>
+														<button type="button" class="btn_delete" th:onclick="|deleteCart(${cart.cartSq})|">
+															<span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span>
+														</button>
+													</span>
+												</div>
+											</div>
 										</div>
-										<div class="thumb_box">
-											<a href="">
-												<img th:src="${IMG_PATH} + '/' + ${cart.sysImgNm}" src="/" width="100%" alt="">
-											</a>
+									</div>
+								</th:block>
+								<!-- //주문상품 -->
+								<!-- 주문상품 -->
+								<div class="goods_info">
+									<div class="order_desc">
+										<div class="form_box">
+											<div class="form_field">
+												<input id="od_item_12" type="checkbox"><label for="od_item_12"><span class="sr-only">상품선택</span></label>
+											</div>
 										</div>
-										<div class="info_box">
-											<p class="od_name">
+										<div class="goods_box">
+											<div class="gd_item">
 												<a href="">
-													<span class="brand" th:text="|${cart.brandEnm} ${cart.brandKnm}|"></span>
-													<span th:if="${!#strings.isEmpty(cart.delvResDt)}" class="reserv_date" th:text="|${cart.delvResDt} 배송예정|"></span>
-													<span class="name" th:text="${cart.goodsNm}"></span>
+                                                                    <span class="thumb">
+                                                                        <img src="/images/pc/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
+                                                                    </span>
+													<p>
+														<span class="brand">Mollimelli 몰리멜리</span>
+													</p>
+													<p>
+														<span class="name">남성 오버 소매배색 컬러가디건 (n205ap9829p)</span>
+													</p>
 												</a>
+											</div>
+											<div class="gd_opt">
+												<div class="option_wrap">
+													<span class="title sr-only">주문 옵션</span>
+													<span class="option">BLACK&nbsp;/&nbsp;XXL</span>
+												</div>
+											</div>
+											<div class="gd_calc">
+												<p>
+													<span class="count">수량&nbsp;<em>1</em>개</span>
+												</p>
+											</div>
+										</div>
+										<div class="calc_box">
+											<p>
+												<span class="price_org"><em>39,990</em>원</span>
 											</p>
-											<p class="od_opt" th:each="opt, index : ${cart.itemNmArr}">
-												<span class="option"><em th:text="${cart.itemNmArr[index.index]} + '_' + ${cart.optCdArr[index.index]}"></em></span>
-											</p>
-											<p class="od_opt">
-												<span class="count">수량:<em th:text="${cart.goodsQty}"></em>개</span>
-											</p>
-
-											<p class="od_modify">
-												<button type="button" class="btn_opt_pop" th:onclick="|changeCartOptCd(${cart.cartSq})|"><span>옵션/수량변경</span></button>
+											<p>
+												<span class="price_sale"><em>15,120</em>원</span>
+											<p>
+												<span class="point"><em>999,999</em><stong>P</stong>&nbsp;적립예정</span>
 											</p>
-											<!-- 다다익선 적용 -->
-											<div class="od_moresale applyTmtb" th:if="${(cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'Y') or (cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y')}">
-												<a href="" class="btn_moresale">
-													<i class="ico ico_saletag"></i><span>다다익선 할인적용!</span>
+										</div>
+										<div class="button_box">
+											<p><button type="button" class="btn btn_primary btn_sm"><span>바로 구매</span></button></p>
+											<p><button type="button" id="btn_opt_modify2" class="btn btn_default btn_sm"><span>옵션 / 수량 변경</span></button></p>
+											<div class="util">
+                                                                <span>
+                                                                    <button type="button" class="btn_favorite"><span><i class="ico ico_like2"></i><em class="sr-only">관심상품 추가</em></span></button>
+                                                                </span>
+												<span>
+                                                                    <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
+                                                                </span>
+											</div>
+										</div>
+									</div>
+								</div>
+								<!-- //주문상품 -->
+							</div>
+						</div>
+					</div>
+					<div class="area_part">
+						<h4 class="subH2">
+							일반배송
+						</h4>
+						<div class="part_goods">
+							<div class="goods_cont">
+								<!-- 주문상품 -->
+								<div class="goods_info">
+									<div class="order_desc">
+										<div class="form_box">
+											<div class="form_field">
+												<input id="od_item_21" type="checkbox"><label for="od_item_21"><span class="sr-only">상품선택</span></label>
+											</div>
+										</div>
+										<div class="goods_box">
+											<div class="gd_item">
+												<a href="">
+                                                                    <span class="thumb">
+                                                                        <img src="/images/pc/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
+                                                                    </span>
+													<p>
+														<span class="brand">Mollimelli 몰리멜리</span>
+													</p>
+													<p>
+														<span class="name">남성 오버 소매배색 싸이로 리얼 컬러 블록 세미오버핏 이중지 심플 기본 와이넥 원단추 캐시미어 굵은 꼬임 10종 컬러가디건 (n205ap9829p)</span>
+													</p>
 												</a>
-												<div class="li_moresale applyTmtbNm">
-													<ul>
-														<li th:if="${cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'Y'}" th:text="${cart.qtyTmtbNm}"></li>
-														<li th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y'}" th:text="${cart.amtTmtbNm}"></li>
-													</ul>
+											</div>
+											<div class="gd_opt">
+												<div class="option_wrap">
+													<span class="title sr-only">주문 옵션</span>
+													<span class="option">슬림핏 마이크로 체크 네이비컬러 세미오버핏 이중 심플 기본 와이넥 원단추 캐시미어 굵은 스탠드카라 베이직 셋업수트 자켓&nbsp;/&nbsp;BLACK&nbsp;/&nbsp;XXL</span>
 												</div>
 											</div>
-											<!-- 다다익선 미적용 -->
-											<div class="od_moresale notApplyTmtb" th:if="${(cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'N') or (cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'N')}">
-												<a href="" class="btn_moresale">
-													<i class="ico ico_saletag"></i><span>다다익선 상품보기</span>
+											<div class="gd_calc">
+												<p>
+													<span class="count">수량&nbsp;<em>1</em>개</span>
+												</p>
+											</div>
+											<div class="gd_exinfo">
+												<p>2020.12.25 배송예정</p>
+												<p><a href="" class="btn_moresale"><span class="tag primary">SALE</span>다다익선 상품보기</a></p>
+											</div>
+										</div>
+										<div class="calc_box">
+											<p>
+												<span class="price_org"><em>39,990</em>원</span>
+											</p>
+											<p>
+												<span class="price_sale"><em>15,120</em>원</span>
+											<p>
+												<span class="point"><em>999,999</em><stong>P</stong>&nbsp;적립예정</span>
+											</p>
+										</div>
+										<div class="button_box">
+											<button type="button" class="btn btn_primary btn_sm"><span>바로 구매</span></button>
+											<p><button type="button" class="btn btn_default btn_sm"><span>옵션 / 수량 변경</span></button></p>
+											<div class="util">
+                                                                <span>
+                                                                    <button type="button" class="btn_favorite"><span><i class="ico ico_like2"></i><em class="sr-only">관심상품 추가</em></span></button>
+                                                                </span>
+												<span>
+                                                                    <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
+                                                                </span>
+											</div>
+										</div>
+									</div>
+								</div>
+								<!-- //주문상품 -->
+								<!-- 주문상품 -->
+								<div class="goods_info">
+									<div class="order_desc">
+										<div class="form_box">
+											<div class="form_field">
+												<input id="od_item_22" type="checkbox"><label for="od_item_22"><span class="sr-only">상품선택</span></label>
+											</div>
+										</div>
+										<div class="goods_box">
+											<div class="gd_item">
+												<a href="">
+                                                                    <span class="thumb">
+                                                                        <img src="/images/pc/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
+                                                                    </span>
+													<p>
+														<span class="brand">Mollimelli 몰리멜리</span>
+													</p>
+													<p>
+														<span class="name">남성 오버 소매배색 컬러가디건 (n205ap9829p)</span>
+													</p>
 												</a>
-												<div class="li_moresale notApplyTmtbNm">
-													<ul>
-														<li th:if="${cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'N'}" th:inline="text">[[${cart.qtyTmtbNm}]]<a href=''>대상 상품 보기</a></li>
-														<li th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'N'}" th:inline="text">[[${cart.amtTmtbNm}]]<a href=''>대상 상품 보기</a></li>
-													</ul>
+											</div>
+											<div class="gd_opt">
+												<div class="option_wrap">
+													<span class="title sr-only">주문 옵션</span>
+													<span class="option">BLACK&nbsp;/&nbsp;XXL</span>
 												</div>
 											</div>
-											<!-- 주문불가시 안내추가 -->
-											<div class="info_unable" th:if="${cart.soldoutYn.equals('Y')}">
-												해당상품은 구매가 불가능한 상품입니다. / 상품이 품절되었습니다.
+											<div class="gd_calc">
+												<p>
+													<span class="count">수량&nbsp;<em>1</em>개</span>
+												</p>
 											</div>
-											<!-- //주문불가시 안내추가 -->
 										</div>
-										<div class="info_calc">
-											<p class="price" th:if="${cart.tmtbDcAmt < cart.currPrice}">
-												<span class="selling_price" th:text="|${#numbers.formatInteger(cart.tmtbDcAmt, 1, 'COMMA')} 원|"></span>
-												<del th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></del>
-											</p>
-											<p class="price" th:if="${cart.tmtbDcAmt == cart.currPrice}">
-												<span class="selling_price" th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></span>
+										<div class="calc_box">
+											<p>
+												<span class="price_org"><em>39,990</em>원</span>
 											</p>
-											<p class="point"><span th:text="${#numbers.formatInteger(cart.savePntAmt, 1, 'COMMA')}"></span>p 적립예정</p>
 											<p>
-												<button th:if="${cart.soldoutYn.equals('Y')}" type="button" class="btn btn_sm" disabled><span>구매불가</span></button>
-												<button th:if="${cart.soldoutYn.equals('N')}" type="button" class="btn btn_primary btn_sm" th:onclick="|submitNoMember(${cart.cartSq})|"><span>즉시구매</span></button>
+												<span class="price_sale"><em>15,120</em>원</span>
+											<p>
+												<span class="point"><em>999,999</em><stong>P</stong>&nbsp;적립예정</span>
 											</p>
-											<p class="util">
-										<span>
-											<button type="button" class="btn_favorite" th:classappend="${cart.wishCnt > 0} ? active" onclick="cfnPutWishList(this)" th:goodsCd="${cart.goodsCd}" th:ithrCd="${cart.ithrCd}" th:contentsLoc="${cart.contentsLoc}">
-												<span>
-													<i class="ico ico_like2"></i>
-													<em class="sr-only">관심상품 추가</em>
-												</span>
-											</button>
-										</span>
+										</div>
+										<div class="button_box">
+											<p><button type="button" class="btn btn_primary btn_sm"><span>바로 구매</span></button></p>
+											<p><button type="button" class="btn btn_default btn_sm"><span>옵션 / 수량 변경</span></button></p>
+											<div class="util">
+                                                                <span>
+                                                                    <button type="button" class="btn_favorite"><span><i class="ico ico_like2"></i><em class="sr-only">관심상품 추가</em></span></button>
+                                                                </span>
 												<span>
-											<button type="button" class="btn_delete" th:onclick="|deleteCart(${cart.cartSq})|"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
-										</span>
-											</p>
+                                                                    <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
+                                                                </span>
+											</div>
 										</div>
 									</div>
-									<!-- //주문가능 상품 -->
-								</td>
-								<td class="merge_row delvFeeArea" th:classappend="|delv_${cart.delvFeeCd}|" th:if="${cart.firstCompYn == 'Y'}" th:rowspan="${wmsCartList.size()}"> <!-- 같은 데이터 노출시 동일 영역끼리 병합 : 클래스명 merge_row 추가 -->
-									<div class="info_dlvr">
-										<span class="dlvr_fee" th:if="${cart.delvFee == 0}">배송비 무료</span>
-										<span class="dlvr_fee" th:if="${cart.delvFee > 0}" th:text="|배송비 ${#numbers.formatInteger(cart.delvFee, 1, 'COMMA')} 원|"></span>
-										<a href="#" target="_blank" th:if="${cart.delvFee > 0}">배송비 SAVE 상품 보기</a>
-									</div>
-								</td>
-							</tr>
-						</th:block>
-						</tbody>
-					</table>
-				</div>
-				<div class="btn_area">
-					<button type="button" class="btn btn_default" onclick="deleteCart('WMS_SELECT')"><span>선택 삭제</span></button>
-					<button type="button" class="btn btn_default" onclick="deleteCart('WMS_ALL')"><span>전체 삭제</span></button>
+								</div>
+								<!-- //주문상품 -->
+							</div>
+							<div class="goods_foot"> <!-- 일반배송 테이블에만 .goods_foot -->
+								<div class="order_delivery">
+									<span class="dlvr_fee">배송비 무료</span>
+								</div>
+							</div>
+						</div>
+					</div>
 				</div>
-			</div>
-			<!-- //총알배송 -->
-
-			<!-- 업체직배송 -->
-			<div class="part_deliver delvList" th:if="${delvCartList != null and delvCartList.size() > 0}">
-				<h3 class="subH2 mb20">
-					업체직배송
-				</h3>
-				<div class="tbl type2">
-					<table>
-						<colgroup>
-							<col width="900">
-							<col width="*">
-						</colgroup>
-						<tbody>
-						<th:block th:each="cart, status : ${delvCartList}">
-							<tr class="cartInfo delvCartInfo">
-								<input type="hidden" name="applyQtySectionYn" th:value="${cart.applyQtySectionYn}" />
-								<input type="hidden" name="applyAmtSectionYn" th:value="${cart.applyAmtSectionYn}" />
-								<input type="hidden" name="qtyTmtbSq" th:value="${cart.qtyTmtbSq}" />
-								<input type="hidden" name="qtyTmtbNm" th:value="${cart.qtyTmtbNm}" />
-								<input type="hidden" name="amtTmtbSq" th:value="${cart.amtTmtbSq}" />
-								<input type="hidden" name="amtTmtbNm" th:value="${cart.amtTmtbNm}" />
-								<input type="hidden" name="currPrice" th:value="${cart.currPrice}" />
-								<input type="hidden" name="soldoutYn" th:value="${cart.soldoutYn}" />
-								<input type="hidden" name="tmtbDcAmt" th:value="${cart.tmtbDcAmt}" />
-								<input type="hidden" name="cartSq" th:value="${cart.cartSq}" />
-
-								<td>
-									<div class="info_item" th:classappend="${cart.soldoutYn.equals('Y')} ? unable">
+				<div class="sec_part">
+					<h3 class="subH2">업체직배송</h3>
+					<div class="area_part">
+						<div class="part_goods">
+							<div class="goods_cont">
+								<!-- 주문상품 -->
+								<div class="goods_info">
+									<div class="order_desc">
 										<div class="form_box">
-											<p class="form_field">
-												<input th:id="|od_item_${cart.cartSq}|" name="cartSqArr" type="checkbox" th:value="${cart.cartSq}" th:checked="${cart.soldoutYn.equals('N')}" th:disabled="${cart.soldoutYn.equals('Y')}"/>
-												<label th:for="|od_item_${cart.cartSq}|">
-													<span class="sr-only">상품선택</span>
-												</label>
-											</p>
-										</div>
-										<div class="thumb_box">
-											<a href="">
-												<img th:src="${IMG_PATH} + '/' + ${cart.sysImgNm}" src="/" width="100%" alt="">
-											</a>
+											<div class="form_field">
+												<input id="od_item_31" type="checkbox"><label for="od_item_31"><span class="sr-only">상품선택</span></label>
+											</div>
 										</div>
-										<div class="info_box">
-											<p class="od_name">
+										<div class="goods_box">
+											<div class="gd_item">
 												<a href="">
-													<span class="brand" th:text="|${cart.brandEnm} ${cart.brandKnm}|"></span>
-													<span class="name" th:text="${cart.goodsNm}"></span>
+                                                                    <span class="thumb">
+                                                                        <img src="/images/pc/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
+                                                                    </span>
+													<p>
+														<span class="brand">Mollimelli 몰리멜리</span>
+													</p>
+													<p>
+														<span class="name">남성 오버 소매배색 싸이로 리얼 컬러 블록 세미오버핏 이중지 심플 기본 와이넥 원단추 캐시미어 굵은 꼬임 10종 컬러가디건 (n205ap9829p)</span>
+													</p>
 												</a>
+											</div>
+											<div class="gd_opt">
+												<div class="option_wrap">
+													<span class="title sr-only">주문 옵션</span>
+													<span class="option">슬림핏 마이크로 체크 네이비컬러 세미오버핏 이중 심플 기본 와이넥 원단추 캐시미어 굵은 스탠드카라 베이직 셋업수트 자켓&nbsp;/&nbsp;BLACK&nbsp;/&nbsp;XXL</span>
+												</div>
+											</div>
+											<div class="gd_calc">
+												<p>
+													<span class="count">수량&nbsp;<em>1</em>개</span>
+												</p>
+											</div>
+											<div class="gd_exinfo">
+												<p><a href="" class="btn_moresale"><span class="tag primary">SALE</span>다다익선 상품보기</a></p>
+												<p>2021.03.03 배송예정</p>
+											</div>
+										</div>
+										<div class="calc_box">
+											<p>
+												<span class="price_org"><em>39,990</em>원</span>
 											</p>
-											<p class="od_opt" th:each="opt, index : ${cart.itemNmArr}">
-												<span class="option"><em th:text="${cart.itemNmArr[index.index]} + '_' + ${cart.optCdArr[index.index]}"></em></span>
-											</p>
-											<p class="od_opt">
-												<span class="count">수량:<em th:text="${cart.goodsQty}"></em>개</span>
-											</p>
-											<p class="od_modify">
-												<button type="button" class="btn_opt_pop" th:onclick="|changeCartOptCd(${cart.cartSq})|"><span>옵션/수량변경</span></button>
+											<p>
+												<span class="price_sale"><em>15,120</em>원</span>
+											<p>
+												<span class="point"><em>999,999</em><stong>P</stong>&nbsp;적립예정</span>
 											</p>
-											<!-- 다다익선 적용 -->
-											<div class="od_moresale applyTmtb" th:if="${(cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'Y') or (cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y')}">
-												<a href="" class="btn_moresale">
-													<i class="ico ico_saletag"></i><span>다다익선 할인적용!</span>
+										</div>
+										<div class="button_box">
+											<p><button type="button" class="btn btn_primary btn_sm"><span>바로 구매</span></button></p>
+											<p><button type="button" class="btn btn_default btn_sm"><span>옵션 / 수량 변경</span></button></p>
+											<div class="util">
+                                                                <span>
+                                                                    <button type="button" class="btn_favorite"><span><i class="ico ico_like2"></i><em class="sr-only">관심상품 추가</em></span></button>
+                                                                </span>
+												<span>
+                                                                    <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
+                                                                </span>
+											</div>
+										</div>
+									</div>
+								</div>
+								<!-- //주문상품 -->
+								<!-- 주문상품 -->
+								<div class="goods_info">
+									<div class="order_desc">
+										<div class="form_box">
+											<div class="form_field">
+												<input id="od_item_32" type="checkbox"><label for="od_item_32"><span class="sr-only">상품선택</span></label>
+											</div>
+										</div>
+										<div class="goods_box">
+											<div class="gd_item">
+												<a href="">
+                                                                    <span class="thumb">
+                                                                        <img src="/images/pc/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
+                                                                    </span>
+													<p>
+														<span class="brand">Mollimelli 몰리멜리</span>
+													</p>
+													<p>
+														<span class="name">남성 오버 소매배색 컬러가디건 (n205ap9829p)</span>
+													</p>
 												</a>
-												<div class="li_moresale applyTmtbNm">
-													<ul>
-														<li th:if="${cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'Y'}" th:text="${cart.qtyTmtbNm}"></li>
-														<li th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y'}" th:text="${cart.amtTmtbNm}"></li>
-													</ul>
+											</div>
+											<div class="gd_opt">
+												<div class="option_wrap">
+													<span class="title sr-only">주문 옵션</span>
+													<span class="option">BLACK&nbsp;/&nbsp;XXL</span>
 												</div>
 											</div>
-											<!-- 다다익선 미적용 -->
-											<div class="od_moresale notApplyTmtb" th:if="${(cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'N') or (cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'N')}">
-												<a href="" class="btn_moresale">
-													<i class="ico ico_saletag"></i><span>다다익선 상품보기</span>
+											<div class="gd_calc">
+												<p>
+													<span class="count">수량&nbsp;<em>1</em>개</span>
+												</p>
+											</div>
+											<div class="gd_exinfo">
+												<p>해당 상품은 구매 불가능한 상품입니다.</p>
+											</div>
+										</div>
+										<div class="calc_box">
+											<p>
+												<span class="price_org"><em>39,990</em>원</span>
+											</p>
+											<p>
+												<span class="price_sale"><em>15,120</em>원</span>
+											<p>
+												<span class="point"><em>999,999</em><stong>P</stong>&nbsp;적립예정</span>
+											</p>
+										</div>
+										<div class="button_box">
+											<p><button type="button" class="btn btn_dark btn_sm" disabled=""><span>구매 불가</span></button></p>
+											<p><button type="button" class="btn btn_default btn_sm"><span>옵션 / 수량 변경</span></button></p>
+											<div class="util">
+                                                                <span>
+                                                                    <button type="button" class="btn_favorite"><span><i class="ico ico_like2"></i><em class="sr-only">관심상품 추가</em></span></button>
+                                                                </span>
+												<span>
+                                                                    <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
+                                                                </span>
+											</div>
+										</div>
+									</div>
+								</div>
+								<!-- //주문상품 -->
+							</div>
+							<div class="goods_foot">
+								<div class="order_delivery">
+									<span class="dlvr_fee">배송비&nbsp;<em>3,000</em>원</span>
+									<span class="dlvr_shop"><em>TBJ</em>&nbsp;업체직배송</span>
+									<a href="#" class="btn_popup_save">배송비 SAVE 상품 보기</a>
+								</div>
+							</div>
+						</div>
+						<div class="part_goods">
+							<div class="goods_cont">
+								<!-- 주문상품 -->
+								<div class="goods_info">
+									<div class="order_desc">
+										<div class="form_box">
+											<div class="form_field">
+												<input id="od_item_33" type="checkbox"><label for="od_item_33"><span class="sr-only">상품선택</span></label>
+											</div>
+										</div>
+										<div class="goods_box">
+											<div class="gd_item">
+												<a href="">
+                                                                    <span class="thumb">
+                                                                        <img src="/images/pc/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
+                                                                    </span>
+													<p>
+														<span class="brand">Mollimelli 몰리멜리</span>
+													</p>
+													<p>
+														<span class="name">남성 오버 소매배색 싸이로 리얼 컬러 블록 세미오버핏 이중지 심플 기본 와이넥 원단추 캐시미어 굵은 꼬임 10종 컬러가디건 (n205ap9829p)</span>
+													</p>
 												</a>
-												<div class="li_moresale notApplyTmtbNm">
-													<ul>
-														<li th:if="${cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'N'}" th:text="${cart.qtyTmtbNm}"><a href="">대상 상품 보기</a></li>
-														<li th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'N'}" th:text="${cart.amtTmtbNm}"><a href="">대상 상품 보기</a></li>
-													</ul>
+											</div>
+											<div class="gd_opt">
+												<div class="option_wrap">
+													<span class="title sr-only">주문 옵션</span>
+													<span class="option">슬림핏 마이크로 체크 네이비컬러 세미오버핏 이중 심플 기본 와이넥 원단추 캐시미어 굵은 스탠드카라 베이직 셋업수트 자켓&nbsp;/&nbsp;BLACK&nbsp;/&nbsp;XXL</span>
 												</div>
 											</div>
-											<!-- 주문불가시 안내추가 -->
-											<div class="info_unable" th:if="${cart.soldoutYn.equals('Y')}">
-												해당상품은 구매가 불가능한 상품입니다. / 상품이 품절되었습니다.
+											<div class="gd_calc">
+												<p>
+													<span class="count">수량&nbsp;<em>1</em>개</span>
+												</p>
+											</div>
+											<div class="gd_exinfo">
+												<p><a href="" class="btn_moresale"><span class="tag primary">SALE</span>다다익선 상품보기</a></p>
 											</div>
-											<!-- //주문불가시 안내추가 -->
 										</div>
-										<div class="info_calc">
-											<p class="price" th:if="${cart.tmtbDcAmt < cart.currPrice}">
-												<span class="selling_price" th:text="|${#numbers.formatInteger(cart.tmtbDcAmt, 1, 'COMMA')} 원|"></span>
-												<del th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></del>
-											</p>
-											<p class="price" th:if="${cart.tmtbDcAmt == cart.currPrice}">
-												<span class="selling_price" th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></span>
+										<div class="calc_box">
+											<p>
+												<span class="price_org"><em>39,990</em>원</span>
 											</p>
-											<p class="point"><span th:text="${#numbers.formatInteger(cart.savePntAmt, 1, 'COMMA')}"></span>p 적립예정</p>
 											<p>
-												<button th:if="${cart.soldoutYn.equals('Y')}" type="button" class="btn btn_sm" disabled><span>구매불가</span></button>
-												<button th:if="${cart.soldoutYn.equals('N')}" type="button" class="btn btn_primary btn_sm" th:onclick="|submitNoMember(${cart.cartSq})|"><span>즉시구매</span></button>
+												<span class="price_sale"><em>15,120</em>원</span>
+											<p>
+												<span class="point"><em>999,999</em><stong>P</stong>&nbsp;적립예정</span>
 											</p>
-											<p class="util">
-										<span>
-											<button type="button" class="btn_favorite" th:classappend="${cart.wishCnt > 0} ? active" onclick="cfnPutWishList(this)" th:goodsCd="${cart.goodsCd}" th:ithrCd="${cart.ithrCd}" th:contentsLoc="${cart.contentsLoc}"><span><i class="ico ico_like2"></i><em class="sr-only">관심상품 추가</em></span></button>
-										</span>
+										</div>
+										<div class="button_box">
+											<p><button type="button" class="btn btn_primary btn_sm"><span>바로 구매</span></button></p>
+											<p><button type="button" class="btn btn_default btn_sm"><span>옵션 / 수량 변경</span></button></p>
+											<div class="util">
+                                                                <span>
+                                                                    <button type="button" class="btn_favorite"><span><i class="ico ico_like2"></i><em class="sr-only">관심상품 추가</em></span></button>
+                                                                </span>
 												<span>
-											<button type="button" class="btn_delete" th:onclick="|deleteCart(${cart.cartSq})|"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
-										</span>
-											</p>
+                                                                    <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
+                                                                </span>
+											</div>
 										</div>
 									</div>
-								</td>
-								<td class="merge_row delvFeeArea" th:classappend="|delv_${cart.delvFeeCd}|" th:if="${cart.firstCompYn == 'Y'}" th:rowspan="${cart.compCnt}"> <!-- 같은 데이터 노출시 동일 영역끼리 병합 : 클래스명 merge_row 추가 -->
-									<div class="info_dlvr">
-										<span class="dlvr_fee" th:if="${cart.delvFee == 0}">배송비 무료</span>
-										<span class="dlvr_fee" th:if="${cart.delvFee > 0}" th:text="|배송비 ${#numbers.formatInteger(cart.delvFee, 1, 'COMMA')} 원|"></span>
-										<span class="dlvr_shop" th:text="|${cart.supplyCompNm} 업체직배송|"></span>
-										<a href="#" target="_blank" th:if="${cart.delvFee > 0}">배송비 SAVE 상품 보기</a>
-									</div>
-								</td>
-							</tr>
-						</th:block>
-						</tbody>
-					</table>
-				</div>
-				<div class="btn_area">
-					<button type="button" class="btn btn_default" onclick="deleteCart('DELV_SELECT')"><span>선택 삭제</span></button>
-					<button type="button" class="btn btn_default" onclick="deleteCart('DELV_ALL')"><span>전체 삭제</span></button>
+								</div>
+								<!-- //주문상품 -->
+							</div>
+							<div class="goods_foot">
+								<div class="order_delivery">
+									<span class="dlvr_fee">배송비&nbsp;무료</span>
+								</div>
+							</div>
+						</div>
+					</div>
 				</div>
-			</div>
-			<!-- //업체직배송 -->
+			</form>
 		</div>
 	</div>
 	<div class="od_side">
@@ -313,33 +570,33 @@
 			<div class="tit_box">
 				<h3>결제 정보</h3>
 				<span>
-				<em class="number" th:text="${order.totCartCnt}"></em>개의 상품
-			</span>
+                                    <em class="number">14</em>개의 상품
+                                </span>
 			</div>
 			<div class="od_amount_box">
 				<dl>
 					<div>
 						<dt>상품금액</dt>
-						<dd><em class="sumCurrPrice" th:text="${#numbers.formatInteger(order.sumOrdAmt, 1, 'COMMA')}"></em> 원</dd>
+						<dd><em>1,746,500</em>원</dd>
 					</div>
 					<div>
 						<dt>배송비</dt>
-						<dd><em class="totDelvFee" th:text="${#numbers.formatInteger(order.totDelvFee, 1, 'COMMA')}"></em> 원</dd>
+						<dd><em>0</em>원</dd>
 					</div>
 					<div>
 						<dt>할인금액</dt>
-						<dd><span class="disc_amount"><em class="totDcAmt" id="totDcAmt" th:text="${#numbers.formatInteger(order.totDcAmt, 1, 'COMMA')}"></em> 원</span></dd>
+						<dd><span class="disc_amount"><em>-46,500</em>원</span></dd>
 					</div>
 				</dl>
 			</div>
 			<div class="totalprice_box">
 				<dl>
 					<dt>총 결제 예정 금액</dt>
-					<dd data-weight="price" data-font="lato"><span class="sumRealPayAmt" id="sumRealPayAmt" th:text="${#numbers.formatInteger(order.sumRealPayAmt + order.totDelvFee, 1, 'COMMA')}"></span> 원</dd>
+					<dd><span>1,700,000</span>원</dd>
 				</dl>
 			</div>
 			<div class="btn_box">
-				<button class="btn btn_primary btn_block btn_md"><span>주문하기</span></button>
+				<button class="btn btn_primary btn_block btn_md" onclick="fnSubmitNoMember('all')"><span>구매하기</span></button>
 			</div>
 		</div>
 		<div class="area_salecoupon">
@@ -347,44 +604,34 @@
 			<div class="form_field">
 				<div class="input_wrap form_full">
 					<label class="input_label sr-only">할인코드입력</label>
-					<input type="text" id="serialCpnNm" class="form_control" placeholder="할인코드를 입력해주세요.">
+					<input type="text" class="form_control" placeholder="할인코드를 입력해주세요.">
 				</div>
-				<button type="button" class="btn btn_dark btn_default" onclick="serialCpnApply()"><span>적용</span></button>
+				<button type="button" class="btn btn_dark btn_sm"><span>적용</span></button>
 			</div>
 			<div class="coupon_box">
 				<div class="coupon">
 					<div>
-						<p class="cp_name"></p>
+						<p class="cp_name">
+							TBJ 시즌오프 20% 할인쿠폰
+						</p>
 						<p class="cp_cont">
-							<!--<span><em>12,399,900</em>원</span>
-							<span><em>40%</em></span>-->
-							<span class="cp_dc_val"></span>
+							<span><em>12,399,900</em>원</span>
+							<span><em>40</em>%</span>
 						</p>
 						<p class="cp_condition">
-							<!--500,000원 이상 구매 시 최대 50,000원 할인
-							<span><em class="tag">99장 보유</em></span>-->
+							500,000원 이상 구매 시 최대 50,000원 할인
+							<span><em class="tag primary_line">99장 보유</em></span>
 						</p>
 					</div>
 					<p class="cp_date">
-						<span class="availStdt"></span>&nbsp;~&nbsp;<span class="availEddt"></span>
+						<span>2021.01.01</span>&nbsp;~&nbsp;<span>2021.12.30</span>
 					</p>
-					<button type="button" class="btn_close_code" onClick="cancelCartCpn()">
-					<span>
-						<i class="ico ico_close1"></i>
-						<em class="sr-only">닫기</em>
-					</span>
-					</button>
-				</div>
-				<div class="info_coupon">
-					<button type="button" id="btn_cpinfo_pop">
-						<span>쿠폰 사용안내</span>
-					</button>
 				</div>
+				<button type="button" class="btn_underline" id="btn_couponInfo_pop">
+					<span>사용안내</span>
+				</button>
 			</div>
 		</div>
-		<div class="area_saleitem">
-
-		</div>
 	</div>
 	<div class="clear"></div>
 	<!-- // CONT-BODY -->
@@ -413,10 +660,7 @@
 	}
 
 	$(document).ready(function() {
-		/*
-		alert("a");
-		
-		let compsList = [];
+		/*let compsList = [];
 		let temp 			= new Object;
 		temp.goodsCd 		= "10770353";
 		temp.optCd 			= "9383682-1";
@@ -428,10 +672,7 @@
 		temp.contentsLoc 	= "G028_YYY";
 		temp.planDtlSq 		= "123";
 		compsList.push(temp);
-		cfnAddCart(compsList);
-		
-		alert("b");
-		*/
+		cfnAddCart(compsList);*/
 		
 		
 		
@@ -990,7 +1231,7 @@
 	}
 
 	//옵션변경 팝업열기
-	function changeCartOptCd(cartSq) {
+	function fnChangeCartOptCd(cartSq) {
 		$.ajax( {
 			type: "POST",
 			url : '/cart/goods/info',
@@ -1004,7 +1245,14 @@
 		});
 	}
 
-	function submitNoMember(cartSq) {
+	// 상품상세 페이지 이동 처리
+	var fnGoToGoodsDetail = function(param) {
+		let goodsCd = $(param).attr('goodsCd');
+		cfnGoToPage(_PAGE_GOODS_DETAIL + goodsCd);
+	}
+
+	// 주문하기
+	function fnSubmitNoMember(cartSq) {
 		if(cartSq == "all") {
 			$("#cartListForm").submit();
 		} else {
@@ -1015,53 +1263,4 @@
 		}
 	}
 </script>
-
-
-
-
-
-<form id="order_info" name="order_info" method="post" action="/order/pay/result/response" ></form>
-<input type="button" id="buyBtn" value="KCP TEST" style="width:100px;height:200px;" />
-<script type="text/javascript">
-	$(document).on("click", "#buyBtn", function() {
-		let orderData = {
-			  pgGb		: "KCP"
-			, payMeans	: "G014_10"
-			, ordNo		: "1"
-			, goodsNm	: "상품 테스트"
-			, payAmt	: "1233"
-			, ordNm		: "이태영"
-			, ordEmail	: "xodud1202@naver.com"
-			, ordTelno	: "02-0000-0000"
-			, ordPhnno	: "010-7111-4489"
-		};
-
-		let jsonData = JSON.stringify(orderData);
-
-		$.ajax( {
-			type		: "POST",
-			url			: '/order/create/preOrder',
-			data		: jsonData,
-			dataType	: 'html',
-			beforeSend : function(xhr, settings) {
-				xhr.setRequestHeader("AJAX"			, "true");
-				xhr.setRequestHeader('Accept'		, 'application/json');
-				xhr.setRequestHeader('Content-Type'	, 'application/json');
-				gagajf.showProgressbar(true);
-			},
-			error : function(e) {
-				alert(3);
-			},
-			success 	: function(result) {
-				// 결재정보로드
-				$("#order_info").html(result);
-				//kcp_AJAX();
-				jsf__pay(document.order_info);
-				//fnKakaoPaymentReady();
-				//fnNaverPaymentReady();
-			}
-		});
-	});
-</script>
-
 </html>

+ 1019 - 0
src/main/webapp/WEB-INF/views/web/cart/CartListAjaxFormWeb_20210319.html

@@ -0,0 +1,1019 @@
+<html lang="ko"
+	  xmlns:th="http://www.thymeleaf.org">
+<form id="cartListForm" method="post" action="/order/noMember">
+	<!--<input type="hidden" name="cartCpnDcAmt" id="cartCpnDcAmt" th:value="${param.cartCpnDcAmt}" />-->
+
+	<!-- CONT-BODY -->
+	<div class="od_cont">
+		<div class="sec_head shotDelvSelect">
+			<div class="tbl type4">
+				<table>
+					<colgroup>
+						<col width="150">
+						<col width="*">
+					</colgroup>
+					<tbody>
+					<tr>
+						<th>
+							배송방법 선택
+						</th>
+						<td>
+							<div class="form_field">
+								<div>
+									<input type="radio" name="shotDelvUseYn" id="blt_ship1" value="Y" th:checked="${order.shotCanYn.equals('Y')}">
+									<label for="blt_ship1"><span><em class="tag">총알배송</em><span th:text="|${order.shotDelvDt}일 24:00 까지 도착|"></span></span></label>
+								</div>
+								<div>
+									<input type="radio" name="shotDelvUseYn" id="blt_ship2" value="N" th:checked="${!order.shotCanYn.equals('Y')}">
+									<label for="blt_ship2"><span>총알 배송 안함</span></label>
+								</div>
+							</div>
+						</td>
+					</tr>
+					</tbody>
+				</table>
+			</div>
+		</div>
+		<div class="sec_body">
+			<!-- 총알배송 -->
+			<div class="part_deliver wmsList" th:if="${wmsCartList != null and wmsCartList.size() > 0}">
+				<h3 class="subH2 mb20" th:if="${order.shotCanYn.equals('Y')}">
+					STYLE24 총알배송
+					<span class="ml10">오늘 자정까지 도착</span>
+				</h3>
+				<h3 class="subH2 mb20" th:if="${order.shotCanYn.equals('N')}">
+					STYLE24 일반배송
+				</h3>
+				<div class="tbl type2">
+					<table>
+						<colgroup>
+							<col width="900">
+							<col width="*">
+						</colgroup>
+						<tbody>
+						<th:block th:each="cart, status : ${wmsCartList}">
+							<tr class="cartInfo wmsCartInfo">
+								<input type="hidden" name="applyQtySectionYn" th:value="${cart.applyQtySectionYn}" />
+								<input type="hidden" name="applyAmtSectionYn" th:value="${cart.applyAmtSectionYn}" />
+								<input type="hidden" name="qtyTmtbSq" th:value="${cart.qtyTmtbSq}" />
+								<input type="hidden" name="qtyTmtbNm" th:value="${cart.qtyTmtbNm}" />
+								<input type="hidden" name="amtTmtbSq" th:value="${cart.amtTmtbSq}" />
+								<input type="hidden" name="amtTmtbNm" th:value="${cart.amtTmtbNm}" />
+								<input type="hidden" name="currPrice" th:value="${cart.currPrice}" />
+								<input type="hidden" name="soldoutYn" th:value="${cart.soldoutYn}" />
+								<input type="hidden" name="tmtbDcAmt" th:value="${cart.tmtbDcAmt}" />
+								<input type="hidden" name="cartSq" th:value="${cart.cartSq}" />
+
+								<td>
+									<!-- 주문가능 상품 -->
+									<div class="info_item" th:classappend="${cart.soldoutYn.equals('Y')} ? unable"> <!-- 주문불가시 class="unable" 추가 / 인풋, 버튼 disable 처리 -->
+										<div class="form_box">
+											<p class="form_field">
+												<input th:id="|od_item_${cart.cartSq}|" name="cartSqArr" type="checkbox" th:value="${cart.cartSq}" th:checked="${cart.soldoutYn.equals('N')}" th:disabled="${cart.soldoutYn.equals('Y')}"/>
+												<label th:for="|od_item_${cart.cartSq}|">
+													<span class="sr-only">상품선택</span>
+												</label>
+											</p>
+										</div>
+										<div class="thumb_box">
+											<a href="">
+												<img th:src="${IMG_PATH} + '/' + ${cart.sysImgNm}" src="/" width="100%" alt="">
+											</a>
+										</div>
+										<div class="info_box">
+											<p class="od_name">
+												<a href="">
+													<span class="brand" th:text="|${cart.brandEnm} ${cart.brandKnm}|"></span>
+													<span th:if="${!#strings.isEmpty(cart.delvResDt)}" class="reserv_date" th:text="|${cart.delvResDt} 배송예정|"></span>
+													<span class="name" th:text="${cart.goodsNm}"></span>
+												</a>
+											</p>
+											<p class="od_opt" th:each="opt, index : ${cart.itemNmArr}">
+												<span class="option"><em th:text="${cart.itemNmArr[index.index]} + '_' + ${cart.optCdArr[index.index]}"></em></span>
+											</p>
+											<p class="od_opt">
+												<span class="count">수량:<em th:text="${cart.goodsQty}"></em>개</span>
+											</p>
+
+											<p class="od_modify">
+												<button type="button" class="btn_opt_pop" th:onclick="|fnChangeCartOptCd(${cart.cartSq})|"><span>옵션/수량변경</span></button>
+											</p>
+											<!-- 다다익선 적용 -->
+											<div class="od_moresale applyTmtb" th:if="${(cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'Y') or (cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y')}">
+												<a href="" class="btn_moresale">
+													<i class="ico ico_saletag"></i><span>다다익선 할인적용!</span>
+												</a>
+												<div class="li_moresale applyTmtbNm">
+													<ul>
+														<li th:if="${cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'Y'}" th:text="${cart.qtyTmtbNm}"></li>
+														<li th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y'}" th:text="${cart.amtTmtbNm}"></li>
+													</ul>
+												</div>
+											</div>
+											<!-- 다다익선 미적용 -->
+											<div class="od_moresale notApplyTmtb" th:if="${(cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'N') or (cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'N')}">
+												<a href="" class="btn_moresale">
+													<i class="ico ico_saletag"></i><span>다다익선 상품보기</span>
+												</a>
+												<div class="li_moresale notApplyTmtbNm">
+													<ul>
+														<li th:if="${cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'N'}" th:inline="text">[[${cart.qtyTmtbNm}]]<a href=''>대상 상품 보기</a></li>
+														<li th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'N'}" th:inline="text">[[${cart.amtTmtbNm}]]<a href=''>대상 상품 보기</a></li>
+													</ul>
+												</div>
+											</div>
+											<!-- 주문불가시 안내추가 -->
+											<div class="info_unable" th:if="${cart.soldoutYn.equals('Y')}">
+												해당상품은 구매가 불가능한 상품입니다. / 상품이 품절되었습니다.
+											</div>
+											<!-- //주문불가시 안내추가 -->
+										</div>
+										<div class="info_calc">
+											<p class="price" th:if="${cart.tmtbDcAmt < cart.currPrice}">
+												<span class="selling_price" th:text="|${#numbers.formatInteger(cart.tmtbDcAmt, 1, 'COMMA')} 원|"></span>
+												<del th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></del>
+											</p>
+											<p class="price" th:if="${cart.tmtbDcAmt == cart.currPrice}">
+												<span class="selling_price" th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></span>
+											</p>
+											<p class="point"><span th:text="${#numbers.formatInteger(cart.savePntAmt, 1, 'COMMA')}"></span>p 적립예정</p>
+											<p>
+												<button th:if="${cart.soldoutYn.equals('Y')}" type="button" class="btn btn_sm" disabled><span>구매불가</span></button>
+												<button th:if="${cart.soldoutYn.equals('N')}" type="button" class="btn btn_primary btn_sm" th:onclick="|fnSubmitNoMember(${cart.cartSq})|"><span>즉시구매</span></button>
+											</p>
+											<p class="util">
+												<span>
+													<button type="button" class="btn_favorite" th:classappend="${cart.wishCnt > 0} ? active" onclick="cfnPutWishList(this)" th:goodsCd="${cart.goodsCd}" th:ithrCd="${cart.ithrCd}" th:contentsLoc="${cart.contentsLoc}">
+														<span>
+															<i class="ico ico_like2"></i>
+															<em class="sr-only">관심상품 추가</em>
+														</span>
+													</button>
+												</span>
+												<span>
+													<button type="button" class="btn_delete" th:onclick="|deleteCart(${cart.cartSq})|"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
+												</span>
+											</p>
+										</div>
+									</div>
+									<!-- //주문가능 상품 -->
+								</td>
+								<td class="merge_row delvFeeArea" th:classappend="|delv_${cart.delvFeeCd}|" th:if="${cart.firstCompYn == 'Y'}" th:rowspan="${wmsCartList.size()}"> <!-- 같은 데이터 노출시 동일 영역끼리 병합 : 클래스명 merge_row 추가 -->
+									<div class="info_dlvr">
+										<span class="dlvr_fee" th:if="${cart.delvFee == 0}">배송비 무료</span>
+										<span class="dlvr_fee" th:if="${cart.delvFee > 0}" th:text="|배송비 ${#numbers.formatInteger(cart.delvFee, 1, 'COMMA')} 원|"></span>
+										<a href="#" target="_blank" th:if="${cart.delvFee > 0}">배송비 SAVE 상품 보기</a>
+									</div>
+								</td>
+							</tr>
+						</th:block>
+						</tbody>
+					</table>
+				</div>
+				<div class="btn_area">
+					<button type="button" class="btn btn_default" onclick="deleteCart('WMS_SELECT')"><span>선택 삭제</span></button>
+					<button type="button" class="btn btn_default" onclick="deleteCart('WMS_ALL')"><span>전체 삭제</span></button>
+				</div>
+			</div>
+			<!-- //총알배송 -->
+
+			<!-- 업체직배송 -->
+			<div class="part_deliver delvList" th:if="${delvCartList != null and delvCartList.size() > 0}">
+				<h3 class="subH2 mb20">
+					업체직배송
+				</h3>
+				<div class="tbl type2">
+					<table>
+						<colgroup>
+							<col width="900">
+							<col width="*">
+						</colgroup>
+						<tbody>
+						<th:block th:each="cart, status : ${delvCartList}">
+							<tr class="cartInfo delvCartInfo">
+								<input type="hidden" name="applyQtySectionYn" th:value="${cart.applyQtySectionYn}" />
+								<input type="hidden" name="applyAmtSectionYn" th:value="${cart.applyAmtSectionYn}" />
+								<input type="hidden" name="qtyTmtbSq" th:value="${cart.qtyTmtbSq}" />
+								<input type="hidden" name="qtyTmtbNm" th:value="${cart.qtyTmtbNm}" />
+								<input type="hidden" name="amtTmtbSq" th:value="${cart.amtTmtbSq}" />
+								<input type="hidden" name="amtTmtbNm" th:value="${cart.amtTmtbNm}" />
+								<input type="hidden" name="currPrice" th:value="${cart.currPrice}" />
+								<input type="hidden" name="soldoutYn" th:value="${cart.soldoutYn}" />
+								<input type="hidden" name="tmtbDcAmt" th:value="${cart.tmtbDcAmt}" />
+								<input type="hidden" name="cartSq" th:value="${cart.cartSq}" />
+
+								<td>
+									<div class="info_item" th:classappend="${cart.soldoutYn.equals('Y')} ? unable">
+										<div class="form_box">
+											<p class="form_field">
+												<input th:id="|od_item_${cart.cartSq}|" name="cartSqArr" type="checkbox" th:value="${cart.cartSq}" th:checked="${cart.soldoutYn.equals('N')}" th:disabled="${cart.soldoutYn.equals('Y')}"/>
+												<label th:for="|od_item_${cart.cartSq}|">
+													<span class="sr-only">상품선택</span>
+												</label>
+											</p>
+										</div>
+										<div class="thumb_box">
+											<a href="">
+												<img th:src="${IMG_PATH} + '/' + ${cart.sysImgNm}" src="/" width="100%" alt="">
+											</a>
+										</div>
+										<div class="info_box">
+											<p class="od_name">
+												<a href="">
+													<span class="brand" th:text="|${cart.brandEnm} ${cart.brandKnm}|"></span>
+													<span class="name" th:text="${cart.goodsNm}"></span>
+												</a>
+											</p>
+											<p class="od_opt" th:each="opt, index : ${cart.itemNmArr}">
+												<span class="option"><em th:text="${cart.itemNmArr[index.index]} + '_' + ${cart.optCdArr[index.index]}"></em></span>
+											</p>
+											<p class="od_opt">
+												<span class="count">수량:<em th:text="${cart.goodsQty}"></em>개</span>
+											</p>
+											<p class="od_modify">
+												<button type="button" class="btn_opt_pop" th:onclick="|fnChangeCartOptCd(${cart.cartSq})|"><span>옵션/수량변경</span></button>
+											</p>
+											<!-- 다다익선 적용 -->
+											<div class="od_moresale applyTmtb" th:if="${(cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'Y') or (cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y')}">
+												<a href="" class="btn_moresale">
+													<i class="ico ico_saletag"></i><span>다다익선 할인적용!</span>
+												</a>
+												<div class="li_moresale applyTmtbNm">
+													<ul>
+														<li th:if="${cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'Y'}" th:text="${cart.qtyTmtbNm}"></li>
+														<li th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y'}" th:text="${cart.amtTmtbNm}"></li>
+													</ul>
+												</div>
+											</div>
+											<!-- 다다익선 미적용 -->
+											<div class="od_moresale notApplyTmtb" th:if="${(cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'N') or (cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'N')}">
+												<a href="" class="btn_moresale">
+													<i class="ico ico_saletag"></i><span>다다익선 상품보기</span>
+												</a>
+												<div class="li_moresale notApplyTmtbNm">
+													<ul>
+														<li th:if="${cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'N'}" th:text="${cart.qtyTmtbNm}"><a href="">대상 상품 보기</a></li>
+														<li th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'N'}" th:text="${cart.amtTmtbNm}"><a href="">대상 상품 보기</a></li>
+													</ul>
+												</div>
+											</div>
+											<!-- 주문불가시 안내추가 -->
+											<div class="info_unable" th:if="${cart.soldoutYn.equals('Y')}">
+												해당상품은 구매가 불가능한 상품입니다. / 상품이 품절되었습니다.
+											</div>
+											<!-- //주문불가시 안내추가 -->
+										</div>
+										<div class="info_calc">
+											<p class="price" th:if="${cart.tmtbDcAmt < cart.currPrice}">
+												<span class="selling_price" th:text="|${#numbers.formatInteger(cart.tmtbDcAmt, 1, 'COMMA')} 원|"></span>
+												<del th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></del>
+											</p>
+											<p class="price" th:if="${cart.tmtbDcAmt == cart.currPrice}">
+												<span class="selling_price" th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></span>
+											</p>
+											<p class="point"><span th:text="${#numbers.formatInteger(cart.savePntAmt, 1, 'COMMA')}"></span>p 적립예정</p>
+											<p>
+												<button th:if="${cart.soldoutYn.equals('Y')}" type="button" class="btn btn_sm" disabled><span>구매불가</span></button>
+												<button th:if="${cart.soldoutYn.equals('N')}" type="button" class="btn btn_primary btn_sm" th:onclick="|fnSubmitNoMember(${cart.cartSq})|"><span>즉시구매</span></button>
+											</p>
+											<p class="util">
+										<span>
+											<button type="button" class="btn_favorite" th:classappend="${cart.wishCnt > 0} ? active" onclick="cfnPutWishList(this)" th:goodsCd="${cart.goodsCd}" th:ithrCd="${cart.ithrCd}" th:contentsLoc="${cart.contentsLoc}"><span><i class="ico ico_like2"></i><em class="sr-only">관심상품 추가</em></span></button>
+										</span>
+												<span>
+											<button type="button" class="btn_delete" th:onclick="|deleteCart(${cart.cartSq})|"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
+										</span>
+											</p>
+										</div>
+									</div>
+								</td>
+								<td class="merge_row delvFeeArea" th:classappend="|delv_${cart.delvFeeCd}|" th:if="${cart.firstCompYn == 'Y'}" th:rowspan="${cart.compCnt}"> <!-- 같은 데이터 노출시 동일 영역끼리 병합 : 클래스명 merge_row 추가 -->
+									<div class="info_dlvr">
+										<span class="dlvr_fee" th:if="${cart.delvFee == 0}">배송비 무료</span>
+										<span class="dlvr_fee" th:if="${cart.delvFee > 0}" th:text="|배송비 ${#numbers.formatInteger(cart.delvFee, 1, 'COMMA')} 원|"></span>
+										<span class="dlvr_shop" th:text="|${cart.supplyCompNm} 업체직배송|"></span>
+										<a href="#" target="_blank" th:if="${cart.delvFee > 0}">배송비 SAVE 상품 보기</a>
+									</div>
+								</td>
+							</tr>
+						</th:block>
+						</tbody>
+					</table>
+				</div>
+				<div class="btn_area">
+					<button type="button" class="btn btn_default" onclick="deleteCart('DELV_SELECT')"><span>선택 삭제</span></button>
+					<button type="button" class="btn btn_default" onclick="deleteCart('DELV_ALL')"><span>전체 삭제</span></button>
+				</div>
+			</div>
+			<!-- //업체직배송 -->
+		</div>
+	</div>
+	<div class="od_side">
+		<div class="area_order">
+			<div class="tit_box">
+				<h3>결제 정보</h3>
+				<span>
+				<em class="number" th:text="${order.totCartCnt}"></em>개의 상품
+			</span>
+			</div>
+			<div class="od_amount_box">
+				<dl>
+					<div>
+						<dt>상품금액</dt>
+						<dd><em class="sumCurrPrice" th:text="${#numbers.formatInteger(order.sumOrdAmt, 1, 'COMMA')}"></em> 원</dd>
+					</div>
+					<div>
+						<dt>배송비</dt>
+						<dd><em class="totDelvFee" th:text="${#numbers.formatInteger(order.totDelvFee, 1, 'COMMA')}"></em> 원</dd>
+					</div>
+					<div>
+						<dt>할인금액</dt>
+						<dd><span class="disc_amount"><em class="totDcAmt" id="totDcAmt" th:text="${#numbers.formatInteger(order.totDcAmt, 1, 'COMMA')}"></em> 원</span></dd>
+					</div>
+				</dl>
+			</div>
+			<div class="totalprice_box">
+				<dl>
+					<dt>총 결제 예정 금액</dt>
+					<dd data-weight="price" data-font="lato"><span class="sumRealPayAmt" id="sumRealPayAmt" th:text="${#numbers.formatInteger(order.sumRealPayAmt + order.totDelvFee, 1, 'COMMA')}"></span> 원</dd>
+				</dl>
+			</div>
+			<div class="btn_box">
+				<button class="btn btn_primary btn_block btn_md"><span>주문하기</span></button>
+			</div>
+		</div>
+		<div class="area_salecoupon">
+			<h4>할인코드 입력</h4>
+			<div class="form_field">
+				<div class="input_wrap form_full">
+					<label class="input_label sr-only">할인코드입력</label>
+					<input type="text" id="serialCpnNm" class="form_control" placeholder="할인코드를 입력해주세요.">
+				</div>
+				<button type="button" class="btn btn_dark btn_default" onclick="serialCpnApply()"><span>적용</span></button>
+			</div>
+			<div class="coupon_box">
+				<div class="coupon">
+					<div>
+						<p class="cp_name"></p>
+						<p class="cp_cont">
+							<!--<span><em>12,399,900</em>원</span>
+							<span><em>40%</em></span>-->
+							<span class="cp_dc_val"></span>
+						</p>
+						<p class="cp_condition">
+							<!--500,000원 이상 구매 시 최대 50,000원 할인
+							<span><em class="tag">99장 보유</em></span>-->
+						</p>
+					</div>
+					<p class="cp_date">
+						<span class="availStdt"></span>&nbsp;~&nbsp;<span class="availEddt"></span>
+					</p>
+					<button type="button" class="btn_close_code" onClick="cancelCartCpn()">
+					<span>
+						<i class="ico ico_close1"></i>
+						<em class="sr-only">닫기</em>
+					</span>
+					</button>
+				</div>
+				<div class="info_coupon">
+					<button type="button" id="btn_cpinfo_pop">
+						<span>쿠폰 사용안내</span>
+					</button>
+				</div>
+			</div>
+		</div>
+		<div class="area_saleitem">
+
+		</div>
+	</div>
+	<div class="clear"></div>
+	<!-- // CONT-BODY -->
+</form>
+
+<!-- 옵션변경 팝업 -->
+<div class="modal fade od_pop opt_modify_pop" id="optModifyPop" tabindex="-1" role="dialog" aria-labelledby="optModifyLabel" aria-hidden="true"></div>
+<!-- //옵션변경 팝업 -->
+
+<!-- 즉시구매 form -->
+<form id="cartInfoForm" method="post" action="/order/noMember"></form>
+
+<script th:inline="javascript">
+	let sumRealPayAmt = [[${order.sumRealPayAmt + order.totDelvFee}]];
+	let totDcAmt = [[${order.totDcAmt}]];
+
+	function NotApplyTmtbCartList() {
+		let tmtbSq = 0;
+		let tmtbNm = "";
+		let goodsList = {
+			brandNm : "",
+			goodsNm : "",
+			currPrice : 0,
+			imgPath : ""
+		}
+	}
+
+	$(document).ready(function() {
+		/*let compsList = [];
+		let temp 			= new Object;
+		temp.goodsCd 		= "10770353";
+		temp.optCd 			= "9383682-1";
+		temp.goodsQty 		= 1;
+		temp.goodsType 		= "G056_N";
+		temp.cartGb 		= "C";
+		temp.afLinkCd 		= "afLinkCd";
+		temp.ithrCd 		= "G027_ZZZ";
+		temp.contentsLoc 	= "G028_YYY";
+		temp.planDtlSq 		= "123";
+		compsList.push(temp);
+		cfnAddCart(compsList);*/
+		
+		
+		
+		if([[${!order.shotCanYn.equals('Y')}]]) {
+			// $(".shotDelvSelect").hide();
+		}
+
+		$("#cartListForm .area_salecoupon .coupon_box").hide();
+
+		let loginInfo = [[${loginInfo}]];
+		if(!loginInfo || loginInfo.custNo == null || loginInfo.custNo == 0) {
+			$("#cartListForm .area_salecoupon").hide();
+		}
+
+		// 다다익선 할인 대상(미적용) 리스트
+		notApplyTmtbAreaList();
+
+		/* 세트상품 장바구니 */
+		/*let compsList = [];
+		let temp = new Object;
+		temp.goodsCd = "STYS00000042";
+		temp.itemCd = "14373746";
+		temp.optCd = "베이지110";
+		temp.goodsQty = 1;
+		temp.goodsType = "G056_S";
+		temp.cartGb = "O";
+		temp.afLinkCd = "afLinkCd";
+		temp.ithrCd = "G027_ZZZ";
+		temp.contentsLoc = "G028_YYY";
+		temp.planDtlSq = "123";
+		compsList.push(temp);
+		temp = new Object;
+		temp.goodsCd = "STYS00000042";
+		temp.itemCd = "14373769";
+		temp.optCd = "블루110";
+		temp.goodsQty = 1;
+		temp.goodsType = "G056_S";
+		temp.cartGb = "O";
+		temp.afLinkCd = "afLinkCd";
+		temp.ithrCd = "G027_ZZZ";
+		temp.contentsLoc = "G028_YYY";
+		temp.planDtlSq = "123";
+		compsList.push(temp);
+		temp = new Object;
+		temp.goodsCd = "STYS00000042";
+		temp.itemCd = "14373770";
+		temp.optCd = "아이보리110";
+		temp.goodsQty = 1;
+		temp.goodsType = "G056_S";
+		temp.cartGb = "O";
+		temp.afLinkCd = "afLinkCd";
+		temp.ithrCd = "G027_ZZZ";
+		temp.contentsLoc = "G028_YYY";
+		temp.planDtlSq = "123";
+		compsList.push(temp);
+
+		cfnAddCart(compsList);*/
+
+		/*let compsList = [];
+		let temp = new Object;
+		temp.goodsCd = "14373686";
+		temp.optCd = "챠콜그레이150";
+		temp.goodsQty = 2;
+		temp.goodsType = "G056_D";
+		temp.dealGoodsCd = "STYD000000025"
+		temp.cartGb = "O";
+		temp.afLinkCd = "afLinkCd";
+		temp.ithrCd = "G027_ZZZ";
+		temp.contentsLoc = "G028_YYY";
+		temp.planDtlSq = "123";
+		compsList.push(temp);
+
+		temp = new Object;
+		temp.goodsCd = "14373710";
+		temp.optCd = "L핑크130";
+		temp.goodsQty = 3;
+		temp.goodsType = "G056_D";
+		temp.dealGoodsCd = "STYD000000025"
+		temp.cartGb = "O";
+		temp.afLinkCd = "afLinkCd";
+		temp.ithrCd = "G027_ZZZ";
+		temp.contentsLoc = "G028_YYY";
+		temp.planDtlSq = "123";
+		compsList.push(temp);
+
+		cfnAddCart(compsList);*/
+	});
+
+	function notApplyTmtbAreaList() {
+		let notApplyQtyTmtbList = new Array();
+		let notApplyAmtTmtbList = new Array();
+
+		// 수량 다다익선 조회
+		$("#cartListForm input[name=qtyTmtbSq]").each(function (index) {
+			if($(this).val() != "0" && $(this).parent().find("input[name=applyQtySectionYn]").val() == "N") {
+				let obj = new Object();
+				obj.tmtbSq = $(this).val();
+				obj.tmtbNm = $(this).parent().find("input[name=qtyTmtbNm]").val();
+				obj.currPrice = $(this).parent().find("input[name=currPrice]").val();
+				obj.goodsNm = $(this).parent().find(".info_box").find(".name").text();
+				obj.brandNm = $(this).parent().find(".info_box").find(".brand").text();
+				obj.imgPath = $(this).parent().find(".info_item").find(".thumb_box img").attr("src");
+
+				notApplyQtyTmtbList.push(obj);
+			}
+
+			if($(this).parent().find("input[name=applyAmtSectionYn]").val() == "N") {	   // 다다익선 금액은 기본상품만 가져오면됨 (N은 기본상품에 걸려있음)
+				let obj = new Object();
+				obj.tmtbSq = $(this).parent().find("input[name=amtTmtbSq]").val();
+				obj.tmtbNm = $(this).parent().find("input[name=amtTmtbNm]").val();
+
+				notApplyAmtTmtbList.push(obj);
+			}
+		});
+
+		// 수량 다다익선 정렬
+		var t = new Object();
+		for (let i = 0; i < notApplyQtyTmtbList.length; i++) {
+			for (let j = 0; j < notApplyQtyTmtbList.length - i - 1; j++) {
+				if (notApplyQtyTmtbList[j].tmtbSq > notApplyQtyTmtbList[j + 1].tmtbSq) {
+					t = notApplyQtyTmtbList[j];
+					notApplyQtyTmtbList[j] = notApplyQtyTmtbList[j + 1];
+					notApplyQtyTmtbList[j + 1] = t;
+				}
+			}
+		}
+
+		fnCreateNotApplyTmtbAreaList(notApplyQtyTmtbList, notApplyAmtTmtbList);
+	}
+
+	function fnCreateNotApplyTmtbAreaList(notApplyQtyTmtbList, notApplyAmtTmtbList) {
+		// 정렬 후 같은 다다익선 상품은 한 배열로 묶음
+		let tmtbQtyList = new Array();
+
+		for (let i = 0; i < notApplyQtyTmtbList.length; i++) {
+			let goods = notApplyQtyTmtbList[i];
+			let tmtbInfo = new Object();
+			let chk = false;
+			for (let j = 0; j < tmtbQtyList.length; j++) {
+				let tmtb = tmtbQtyList[j];
+				if (goods.tmtbSq == tmtb.tmtbSq) {
+					tmtbInfo = tmtbQtyList[j];
+					chk = true;
+				}
+			}
+
+			// 현재 상품 정보
+			let goodsInfo = new Object();
+			goodsInfo.brandNm = goods.brandNm;
+			goodsInfo.goodsNm = goods.goodsNm;
+			goodsInfo.imgPath = goods.imgPath;
+			goodsInfo.currPrice = goods.currPrice;
+
+			// 현재 상품 정보 다다익선 정보에 세팅
+			if (chk) {
+				tmtbInfo.goodsList.push(goodsInfo);
+			} else {
+				let obj = new Object();
+				obj.tmtbSq = goods.tmtbSq;
+				obj.tmtbNm = goods.tmtbNm;
+				obj.goodsList = new Array();
+				obj.goodsList.push(goodsInfo);
+				tmtbQtyList.push(obj);
+			}
+		}
+
+		// 수량 다다익선 HTML 작성
+		let tmtbHtml = "";
+		for(let i = 0 ; i < tmtbQtyList.length ; i++) {
+			let tmtb = tmtbQtyList[i];
+			tmtbHtml += '<div class="more_sale qtyNotApplyTmtbList">';
+			for(let j = 0 ; j < tmtb.goodsList.length ; j++) {
+				let goods = tmtb.goodsList[j];
+				tmtbHtml += '<div class="item_gd">\n' +
+					'				<figure>\n' +
+					'					<a href="">\n' +
+					'						<span class="thumb"><img src="';
+				tmtbHtml += goods.imgPath;
+				tmtbHtml += '" alt=""></span>\n' +
+					'					</a>\n' +
+					'					<figcaption>\n' +
+					'						<a href="">\n' +
+					'							<div class="brand">';
+				tmtbHtml += goods.brandNm;
+				tmtbHtml += '</div>\n' +
+					'							<div class="name">';
+				tmtbHtml += goods.goodsNm;
+				tmtbHtml += '</div>\n' +
+					'							<div class="price">\n' +
+					'								<span class="selling_price">';
+				tmtbHtml += Number(goods.currPrice).toLocaleString();
+				tmtbHtml += '</span>\n' +
+					'							</div>\n' +
+					'						</a>\n' +
+					'					</figcaption>\n' +
+					'				</figure>\n' +
+					'			</div>';
+			}
+
+			tmtbHtml += '<div class="txt">\n' +
+				'				<a href="">\n' +
+				'					<i class="ico ico_saletag"></i>\n' +
+				'					<input type="hidden" name="tmtbSq" value="' + tmtb.tmtbSq + '" />' +
+				'					<span>\n';
+			tmtbHtml += tmtb.tmtbNm;
+			tmtbHtml += '</span>\n' +
+				'				</a>\n' +
+				'			</div>\n' +
+				'		</div>';
+		}
+
+		// 금액 다다익선 정보 HTML 작성
+		for(let i = 0 ; i < notApplyAmtTmtbList.length ; i++) {
+			if (notApplyAmtTmtbList[i].tmtbSq != 0) {
+				let tmtb = notApplyAmtTmtbList[i];
+				tmtbHtml += '<div class="more_sale amtNotApplyTmtbList">\n' +
+					'			<div class="txt">\n' +
+					'				<a href="">\n' +
+					'					<i class="ico ico_saletag"></i>\n' +
+					'					<input type="hidden" name="tmtbSq" value="' + tmtb.tmtbSq + '" />' +
+					'					<span>';
+				tmtbHtml += tmtb.tmtbNm;
+				tmtbHtml += '</span>\n' +
+					'				</a>\n' +
+					'			</div>\n' +
+					'		</div>';
+			}
+		}
+
+		if(tmtbHtml != "") {
+			tmtbHtml = "<h4>다다익선 할인 대상이 있습니다.</h4>" + tmtbHtml;
+		}
+
+		$(".area_saleitem").html(tmtbHtml);
+	}
+
+	function cancelCartCpn() {
+		$("#cartListForm #sumRealPayAmt").text(Number(sumRealPayAmt).toLocaleString());
+		$("#cartListForm #totDcAmt").text(Number(totDcAmt).toLocaleString());
+		$("#cartListForm .area_salecoupon .coupon_box").hide();
+	}
+
+	function serialCpnApply() {
+		let cartArr = [];
+		let currPrices = [];
+		$("#cartListForm input[name=cartSqArr]:checked").each(function(index, item) {
+			cartArr.push($(this).val());
+			currPrices.push($(this).parents(".cartInfo").find("input[name=tmtbDcAmt]").val());
+		});
+
+		let data = {
+			rdCpnNm : $("#cartListForm #serialCpnNm").val(),
+			cartSqArr : cartArr,
+			currPrices : currPrices
+		}
+
+		let jsonData = JSON.stringify(data);
+
+		$.ajax( {
+			type: "POST",
+			url : '/cart/list/serialCpnApply',
+			contentType: 'application/json',
+			dataType : 'json',
+			data : jsonData,
+			success : function(result) {
+				$("#cartListForm .area_salecoupon .coupon_box").show();
+
+				// 합계 금액
+				$("#cartListForm #sumRealPayAmt").text(Number(sumRealPayAmt - result.serialCpnInfo.dcAmt).toLocaleString());
+				$("#cartListForm #totDcAmt").text(Number(totDcAmt - result.serialCpnInfo.dcAmt).toLocaleString());
+
+				// 쿠폰 정보
+				$("#cartListForm .area_salecoupon .cp_name").text(result.serialCpnInfo.cpnNm);
+				$("#cartListForm .area_salecoupon .cp_condition").html(result.serialCpnInfo.cpnDesc + "<span><em class='tag'>1장 보유</em></span>");
+				$("#cartListForm .area_salecoupon .availStdt").text(result.serialCpnInfo.availStdt);
+				$("#cartListForm .area_salecoupon .availEddt").text(result.serialCpnInfo.availEddt);
+				if(result.serialCpnInfo.dcWay == "G240_10") {
+					$("#cartListForm .area_salecoupon .cp_dc_val").html( "<em>" + Number(result.serialCpnInfo.dcVal).toLocaleString() + "</em> 원");
+				} else if (result.serialCpnInfo.dcWay == "G240_11") {
+					$("#cartListForm .area_salecoupon .cp_dc_val").html( "<em>" + result.serialCpnInfo.dcVal + "%</em>");
+				}
+			}
+		});
+	}
+
+	//다다익선 적용내역 보기
+	$(document).on('click','.shopping_bag .part_deliver .btn_moresale',function(e){
+		$(this).toggleClass('active');
+		$(this).parents('.od_moresale').find('.li_moresale').toggle();
+		return false;
+	});
+
+	//관심상품 등록
+	$(document).on('click','.shopping_bag .part_deliver .btn_favorite',function(e){
+		$(this).toggleClass('active');
+		return false;
+	});
+
+	function deleteCartAjax(cartArr) {
+		if(cartArr.length < 1) {
+			mcxDialog.alert("삭제하실 상품을 선택해 주세요.");
+			return false;
+		}
+
+		let data = {
+			cartSqArr : cartArr
+		}
+
+		let jsonData = JSON.stringify(data);
+
+		$.ajax( {
+			type: "POST",
+			url : '/cart/deleteCart',
+			contentType: 'application/json',
+			dataType : 'json',
+			data : jsonData,
+			success : function(result) {
+				mcxDialog.alert("삭제 되었습니다.");
+				getCartList();
+			}
+		});
+	}
+
+	function deleteCart(gbn) {
+		let cartArr = [];
+		let confirmMessage = "";
+		if(gbn == "WMS_SELECT") {
+			$("#cartListForm .wmsList input[name=cartSqArr]:checked").each(function () {
+				cartArr.push($(this).val());
+			});
+
+			confirmMessage = "총 " + cartArr.length + "개의 상품을 삭제합니다.";
+		} else if(gbn == "DELV_SELECT") {
+			$("#cartListForm .delvList input[name=cartSqArr]:checked").each(function () {
+				cartArr.push($(this).val());
+			});
+
+			confirmMessage = "총 " + cartArr.length + "개의 상품을 삭제합니다.";
+		} else if(gbn == "WMS_ALL") {
+			$("#cartListForm .wmsList input[name=cartSqArr]").each(function() {
+				cartArr.push($(this).val());
+			});
+
+			confirmMessage = "총알배송상품을 전부 삭제하시겠습니까?";
+		} else if(gbn == "DELV_ALL") {
+			$("#cartListForm .delvList input[name=cartSqArr]").each(function() {
+				cartArr.push($(this).val());
+			});
+
+			confirmMessage = "업체직배송 상품을 전부 삭제하시겠습니까?";
+		} else {
+			cartArr.push(gbn);
+			deleteCartAjax(cartArr);
+			return false;
+		}
+
+		mcxDialog.confirm(confirmMessage, {
+			cancelBtnText: "취소/닫기",		//취소 또는 닫기 버튼명
+			sureBtnText  : "확인",				//처리문 버튼명
+			sureBtnClick : function () {
+				deleteCartAjax(cartArr);
+			}
+		});
+	}
+
+	//쿠폰사용안내 팝업열기
+	$(document).on('click','#btn_cpinfo_pop',function(e){
+		$("#cpinfoPop").modal("show");
+		return false;
+	});
+
+	$("input[name=cartSqArr]").on("change", function(e) {
+		let cartArr = [];
+
+		// 선택된 장바구니 번호
+		$("#cartListForm input[name=cartSqArr]:checked").each(function () {
+			cartArr.push($(this).val());
+		});
+
+		// 선택된 장바구니 정보 가공
+		let data = {	cartSqArr : cartArr }
+		let jsonData = JSON.stringify(data);
+
+		$.ajax( {
+			type: "POST",
+			url : '/cart/change/goods/list',
+			contentType: 'application/json',
+			dataType : 'json',
+			data : jsonData,
+			success : function(result) {
+				fnChangeCartListInfo(result);
+			}
+		});
+	});
+
+	function fnChangeCartListInfo(order) {
+		let wmsList = order.wmsCartList;
+		let delvList = order.delvCartList;
+		let cartList = new Array();
+
+		// 다다익선 정보 숨김
+		$("#cartListForm .applyTmtb").hide();
+		$("#cartListForm .notApplyTmtb").hide();
+
+		// 장바구니 각 상품 가격 정보 할인 전으로 변경
+		$("#cartListForm .cartInfo input[name=cartSq]").each(function() {
+			if($(this).parent().find(".info_calc .price > del").text() != "") {
+				$(this).parent().find(".info_calc .selling_price").text($(this).parent().find(".info_calc .price > del").text());
+				$(this).parent().find(".info_calc .price > del").remove();
+			}
+		});
+		$("#cartListForm").find(".delvFeeArea").html("<div class='info_dlvr'><span class='dlvr_fee'>배송비 무료</span></div>");
+
+		for(let i = 0 ; i < wmsList.length ; i++) {
+			cartList.push(wmsList[i]);
+			$("#cartListForm .wmsCartInfo input[name=cartSq]").each(function() {
+				if(wmsList[i].cartSq == $(this).val()) {
+					let wms = wmsList[i];
+					// $(this).parent().find(".thumb_box img").attr("src", result.imgPath1 + "/" + wms.sysImgNm);
+					$(this).parent().find(".od_moresale .applyTmtbNm > ul").html("");
+					$(this).parent().find(".od_moresale .notApplyTmtbNm > ul").html("");
+
+					// 다다익선 적용 정보 생성성
+					if(wms.qtyTmtbSq > 0 && wms.applyQtySectionYn == "Y") {
+						$(this).parent().find(".applyTmtb .applyTmtbNm > ul").append("<li>" + wms.qtyTmtbNm + "</li>");
+						$(this).parent().find(".applyTmtb").show();
+					}
+					if(wms.amtTmtbSq > 0 && wms.applyAmtSectionYn == "Y") {
+						$(this).parent().find(".applyTmtb .applyTmtbNm > ul").append("<li>" + wms.amtTmtbNm + "</li>");
+						$(this).parent().find(".applyTmtb").show();
+					}
+					if(wms.qtyTmtbSq > 0 && wms.applyQtySectionYn == "N") {
+						$(this).parent().find(".notApplyTmtb .notApplyTmtbNm > ul").append("<li>" + wms.qtyTmtbNm + "<a href=''>대상 상품 보기</a></li>");
+						$(this).parent().find(".notApplyTmtb").show();
+					}
+					if(wms.amtTmtbSq > 0 && wms.applyAmtSectionYn == "N") {
+						$(this).parent().find(".notApplyTmtb .notApplyTmtbNm > ul").append("<li>" + wms.amtTmtbNm + "<a href=''>대상 상품 보기</a></li>");
+						$(this).parent().find(".notApplyTmtb").show();
+					}
+
+					// 다다익선 할인가 적용
+					if(wms.tmtbDcAmt < wms.currPrice) {
+						$(this).parent().find(".info_calc .selling_price").text(Number(wms.tmtbDcAmt).toLocaleString() + " 원");
+						$(this).parent().find(".info_calc .price").append("<del>" + Number(wms.currPrice).toLocaleString() + " 원</del>");
+					}
+
+					if(wms.delvFee == 0) {
+						$(".wmsList").find(".delv_" + wms.delvFeeCd).html("<div class='info_dlvr'><span class='dlvr_fee'>배송비 무료</span></div>");
+					} else {
+						let html = "<div class='info_dlvr'><span class='dlvr_fee'>" + Number(wms.delvFee).toLocaleString() + " 원</span><a href='#' target='_black'>배송비 SAVE 상품 보기</a></div>";
+						$(".wmsList").find(".delv_" + wms.delvFeeCd).html(html);
+						// $(".wmsList").find(".delv_" + wms.delvFeeCd).append("<span class='dlvr_shop'>" + wms.supplyCompNm + " 업체직배송</span>");
+
+					}
+				}
+			});
+		}
+
+		for(let i = 0 ; i < delvList.length ; i++) {
+			cartList.push(delvList[i]);
+			$("#cartListForm .delvCartInfo input[name=cartSq]").each(function() {
+				if(delvList[i].cartSq == $(this).val()) {
+					let delv = delvList[i];
+					// $(this).parent().find(".thumb_box img").attr("src", result.imgPath1 + "/" + wms.sysImgNm);
+					$(this).parent().find(".od_moresale .applyTmtbNm > ul").html("");
+					$(this).parent().find(".od_moresale .notApplyTmtbNm > ul").html("");
+
+					// 다다익선 적용 정보 생성성
+					if(delv.qtyTmtbSq > 0 && delv.applyQtySectionYn == "Y") {
+						$(this).parent().find(".applyTmtb .applyTmtbNm > ul").append("<li>" + delv.qtyTmtbNm + "</li>");
+						$(this).parent().find(".applyTmtb").show();
+					}
+					if(delv.amtTmtbSq > 0 && delv.applyAmtSectionYn == "Y") {
+						$(this).parent().find(".applyTmtb .applyTmtbNm > ul").append("<li>" + delv.amtTmtbNm + "</li>");
+						$(this).parent().find(".applyTmtb").show();
+					}
+					if(delv.qtyTmtbSq > 0 && delv.applyQtySectionYn == "N") {
+						$(this).parent().find(".notApplyTmtb .notApplyTmtbNm > ul").append("<li>" + delv.qtyTmtbNm + "<a href=''>대상 상품 보기</a></li>");
+						$(this).parent().find(".notApplyTmtb").show();
+					}
+					if(delv.amtTmtbSq > 0 && delv.applyAmtSectionYn == "N") {
+						$(this).parent().find(".notApplyTmtb .notApplyTmtbNm > ul").append("<li>" + delv.amtTmtbNm + "<a href=''>대상 상품 보기</a></li>");
+						$(this).parent().find(".notApplyTmtb").show();
+					}
+
+					// 다다익선 할인가 적용
+					if(delv.tmtbDcAmt < delv.currPrice) {
+						$(this).parent().find(".info_calc .selling_price").text(Number(delv.tmtbDcAmt).toLocaleString() + " 원");
+						$(this).parent().find(".info_calc .price").append("<del>" + Number(delv.currPrice).toLocaleString() + " 원</del>");
+					}
+
+					if(delv.delvFee == 0) {
+						$(".delvList").find(".delv_" + delv.delvFeeCd).html("<div class='info_dlvr'><span class='dlvr_fee'>배송비 무료</span></div>");
+					} else {
+						let html = "<div class='info_dlvr'><span class='dlvr_fee'>" + Number(delv.delvFee).toLocaleString() + " 원</span><span class='dlvr_shop'>" + delv.supplyCompNm + " 업체직배송</span><a href='#' target='_black'>배송비 SAVE 상품 보기</a></div>";
+						$(".delvList").find(".delv_" + delv.delvFeeCd).html(html);
+					}
+				}
+			});
+		}
+
+		// 결제 총액 영역 수정
+		$("#cartListForm .sumCurrPrice").text(Number(order.sumOrdAmt).toLocaleString());
+		$("#cartListForm .totDelvFee").text(Number(order.totDelvFee).toLocaleString());
+		sumRealPayAmt = order.sumRealPayAmt + order.totDelvFee;
+		totDcAmt = order.totDcAmt;
+
+		// 할인코드 쿠폰 금액 재확인
+		if($("#cartListForm #serialCpnNm").val()) {
+			serialCpnApply();
+		} else {
+			$("#cartListForm .totDcAmt").text(Number(order.totDcAmt).toLocaleString());
+			$("#cartListForm .sumRealPayAmt").text(Number(order.sumRealPayAmt + order.totDelvFee).toLocaleString());
+			cancelCartCpn();
+		}
+
+		let notApplyQtyTmtbList = new Array();
+		let notApplyAmtTmtbList = new Array();
+		for(let i = 0 ; i < cartList.length ; i++) {
+			let cart = cartList[i];
+			if(cart.applyQtySectionYn == "N") {
+				let obj = new Object();
+				obj.tmtbSq = cart.qtyTmtbSq;
+				obj.tmtbNm = cart.qtyTmtbNm;
+				obj.currPrice = cart.currPrice;
+				obj.goodsNm = cart.goodsNm;
+				obj.brandNm = cart.brandEnm + " " + cart.brandKnm;
+				obj.imgPath = order.imgPath1 + "/" + cart.sysImgNm;
+
+				notApplyQtyTmtbList.push(obj);
+			}
+
+			if(cart.applyAmtSectionYn == "N") {
+				let obj = new Object();
+				obj.tmtbSq = cart.amtTmtbSq;
+				obj.tmtbNm = cart.amtTmtbNm;
+
+				notApplyAmtTmtbList.push(obj);
+			}
+		}
+
+		// 수량 다다익선 정렬
+		var t = new Object();
+		for (let i = 0; i < notApplyQtyTmtbList.length; i++) {
+			for (let j = 0; j < notApplyQtyTmtbList.length - i - 1; j++) {
+				if (notApplyQtyTmtbList[j].tmtbSq > notApplyQtyTmtbList[j + 1].tmtbSq) {
+					t = notApplyQtyTmtbList[j];
+					notApplyQtyTmtbList[j] = notApplyQtyTmtbList[j + 1];
+					notApplyQtyTmtbList[j + 1] = t;
+				}
+			}
+		}
+
+		// 다다익선 적용 대상 상품 노출
+		fnCreateNotApplyTmtbAreaList(notApplyQtyTmtbList, notApplyAmtTmtbList);
+	}
+
+	//옵션변경 팝업열기
+	function fnChangeCartOptCd(cartSq) {
+		$.ajax( {
+			type: "POST",
+			url : '/cart/goods/info',
+			dataType : 'html',
+			data : {cartSq : cartSq},
+			success : function(result) {
+				//fnChangeCartListInfo(result);
+				$("#optModifyPop").html(result);
+				$("#optModifyPop").modal("show");
+			}
+		});
+	}
+
+	// 상품상세 페이지 이동 처리
+	var fnGoToGoodsDetail = function(param) {
+		let goodsCd = $(param).attr('goodsCd');
+		cfnGoToPage(_PAGE_GOODS_DETAIL + goodsCd);
+	}
+
+	// 주문하기
+	function fnSubmitNoMember(cartSq) {
+		if(cartSq == "all") {
+			$("#cartListForm").submit();
+		} else {
+			let html	 = "<input type='hidden' name='cartSqArr' value='" + cartSq + "' />";
+			html		+= "<input type='hidden' name='shotDelvUseYn' value='" + $("input[name=shotDelvUseYn]:checked").val() + "' />";
+			$("#cartInfoForm").html(html);
+			$("#cartInfoForm").submit();
+		}
+	}
+</script>
+</html>

+ 228 - 230
src/main/webapp/WEB-INF/views/web/cart/CartListFormWeb.html

@@ -25,239 +25,237 @@
     <script type="text/javascript" th:src="${@environment.getProperty('pg.kcp.js.url')}" src=""></script>
     <script type="text/javascript" src="/ux/pc/js/payment.js"></script>
 
-    <!--  container -->
-    <div id="container" class="container od">
-        <div class="wrap">
-            <div class="content shopping_bag"> <!-- 페이지특정 클래스 = shop_bag -->
-                <div class="cont_head">
-                    <h2>쇼핑백</h2>
-                    <div class="oder_steps">
-                        <ul>
-                        <li class="on">01 쇼핑백</li>
-                        <li>02 주문/결제</li>
-                        <li>03 주문완료</li>
-                    </ul>
-                </div>
-            </div>
-            <div id="cartAjaxList" class="cont_body">
+	<!--  container -->
+	<div id="container" class="container od">
+		<div class="wrap">
+			<div class="content shopping_bag"> <!-- 페이지특정 클래스 = shop_bag -->
+				<div class="cont_head">
+					<h2>쇼핑백</h2>
+					<div class="oder_steps">
+						<ul>
+							<li class="on">01 쇼핑백</li>
+							<li>02 주문/결제</li>
+							<li>03 주문완료</li>
+						</ul>
+					</div>
+				</div>
+				<div id="cartAjaxList" class="cont_body">
 
-            </div>
-        </div>
-        <div class="content shopping_bag mt100">
-            <div class="cont_head">
-                <h4 class="subH1 t_c mb40">추천상품</h4>
-            </div>
-            <div class="cont_body">
-                <div class="od_recommend">
-                    <div class="swiper-container">
-                        <div class="swiper-wrapper">
-                            <div class="swiper-slide">
-                                <div class="item_prod">
-                                    <div class="item_state">
-                                        <a href="#none" class="itemLink">
-                                            <div class="itemPic">
-                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
-                                                <button type="button" class="itemLike">관심상품 추가</button>
-                                            </div>
-                                            <p class="itemBrand">BRAND NAME1</p>
-                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-                                            <p class="itemPrice">80,100
-                                                <span class="itemPrice_original">89,000</span>
-                                                <span class=" itemPercent">10%</span>
-                                            </p>
-                                            <div class="itemcolorchip">
-                                                <span class="chip_color35" value="ABM">BEIGE</span>
-                                                <span class="chip_color54" value="BDS">BLACK</span>
-                                                <span class="chip_color40" value="YBR">WHITE</span>
-                                            </div>
-                                            <div class="itemComment">#주문 폭주 상품</div>
-                                        </a>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="swiper-slide">
-                                <div class="item_prod">
-                                    <div class="item_state">
-                                        <a href="#none" class="itemLink">
-                                            <div class="itemPic">
-                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
-                                                <button type="button" class="itemLike">관심상품 추가</button>
-                                            </div>
-                                            <p class="itemBrand">BRAND NAME2</p>
-                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-                                            <p class="itemPrice">80,100
-                                                <span class="itemPrice_original">89,000</span>
-                                                <span class=" itemPercent">10%</span>
-                                            </p>
-                                            <div class="itemcolorchip">
-                                                <span class="chip_color35" value="ABM">BEIGE</span>
-                                                <span class="chip_color54" value="BDS">BLACK</span>
-                                                <span class="chip_color40" value="YBR">WHITE</span>
-                                            </div>
-                                            <div class="itemComment">#주문 폭주 상품</div>
-                                        </a>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="swiper-slide">
-                                <div class="item_prod">
-                                    <div class="item_state">
-                                        <a href="#none" class="itemLink">
-                                            <div class="itemPic">
-                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
-                                                <button type="button" class="itemLike">관심상품 추가</button>
-                                            </div>
-                                            <p class="itemBrand">BRAND NAME3</p>
-                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-                                            <p class="itemPrice">80,100
-                                                <span class="itemPrice_original">89,000</span>
-                                                <span class=" itemPercent">10%</span>
-                                            </p>
-                                            <div class="itemcolorchip">
-                                                <span class="chip_color35" value="ABM">BEIGE</span>
-                                                <span class="chip_color54" value="BDS">BLACK</span>
-                                                <span class="chip_color40" value="YBR">WHITE</span>
-                                            </div>
-                                            <div class="itemComment">#주문 폭주 상품</div>
-                                        </a>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="swiper-slide">
-                                <div class="item_prod">
-                                    <div class="item_state">
-                                        <a href="#none" class="itemLink">
-                                            <div class="itemPic">
-                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
-                                                <button type="button" class="itemLike">관심상품 추가</button>
-                                            </div>
-                                            <p class="itemBrand">BRAND NAME4</p>
-                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-                                            <p class="itemPrice">80,100
-                                                <span class="itemPrice_original">89,000</span>
-                                                <span class=" itemPercent">10%</span>
-                                            </p>
-                                            <div class="itemcolorchip">
-                                                <span class="chip_color35" value="ABM">BEIGE</span>
-                                                <span class="chip_color54" value="BDS">BLACK</span>
-                                                <span class="chip_color40" value="YBR">WHITE</span>
-                                            </div>
-                                            <div class="itemComment">#주문 폭주 상품</div>
-                                        </a>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="swiper-slide">
-                                <div class="item_prod">
-                                    <div class="item_state">
-                                        <a href="#none" class="itemLink">
-                                            <div class="itemPic">
-                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
-                                                <button type="button" class="itemLike">관심상품 추가</button>
-                                            </div>
-                                            <p class="itemBrand">BRAND NAME5</p>
-                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-                                            <p class="itemPrice">80,100
-                                                <span class="itemPrice_original">89,000</span>
-                                                <span class=" itemPercent">10%</span>
-                                            </p>
-                                            <div class="itemcolorchip">
-                                                <span class="chip_color35" value="ABM">BEIGE</span>
-                                                <span class="chip_color54" value="BDS">BLACK</span>
-                                                <span class="chip_color40" value="YBR">WHITE</span>
-                                            </div>
-                                            <div class="itemComment">#주문 폭주 상품</div>
-                                        </a>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="swiper-slide">
-                                <div class="item_prod">
-                                    <div class="item_state">
-                                        <a href="#none" class="itemLink">
-                                            <div class="itemPic">
-                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
-                                                <button type="button" class="itemLike">관심상품 추가</button>
-                                            </div>
-                                            <p class="itemBrand">BRAND NAME6</p>
+				</div>
+			</div>
+			<div class="content od_recommend">
+				<div class="cont_head">
+					<h4 class="subH1 t_c mb40">추천상품</h4>
+				</div>
+				<div class="cont_body">
+					<div class="swiper-container">
+						<div class="swiper-wrapper">
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+											</div>
+											<p class="itemBrand">BRAND NAME1</p>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<div class="itemcolorchip">
+												<span class="chip_color35" value="ABM">BEIGE</span>
+												<span class="chip_color54" value="BDS">BLACK</span>
+												<span class="chip_color40" value="YBR">WHITE</span>
+											</div>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+											</div>
+											<p class="itemBrand">BRAND NAME2</p>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<div class="itemcolorchip">
+												<span class="chip_color35" value="ABM">BEIGE</span>
+												<span class="chip_color54" value="BDS">BLACK</span>
+												<span class="chip_color40" value="YBR">WHITE</span>
+											</div>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+											</div>
+											<p class="itemBrand">BRAND NAME3</p>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<div class="itemcolorchip">
+												<span class="chip_color35" value="ABM">BEIGE</span>
+												<span class="chip_color54" value="BDS">BLACK</span>
+												<span class="chip_color40" value="YBR">WHITE</span>
+											</div>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+											</div>
+											<p class="itemBrand">BRAND NAME4</p>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<div class="itemcolorchip">
+												<span class="chip_color35" value="ABM">BEIGE</span>
+												<span class="chip_color54" value="BDS">BLACK</span>
+												<span class="chip_color40" value="YBR">WHITE</span>
+											</div>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+											</div>
+											<p class="itemBrand">BRAND NAME5</p>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<div class="itemcolorchip">
+												<span class="chip_color35" value="ABM">BEIGE</span>
+												<span class="chip_color54" value="BDS">BLACK</span>
+												<span class="chip_color40" value="YBR">WHITE</span>
+											</div>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+											</div>
+											<p class="itemBrand">BRAND NAME6</p>
 
-                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-                                            <p class="itemPrice">80,100
-                                                <span class="itemPrice_original">89,000</span>
-                                                <span class=" itemPercent">10%</span>
-                                            </p>
-                                            <div class="itemcolorchip">
-                                                <span class="chip_color35" value="ABM">BEIGE</span>
-                                                <span class="chip_color54" value="BDS">BLACK</span>
-                                                <span class="chip_color40" value="YBR">WHITE</span>
-                                            </div>
-                                            <div class="itemComment">#주문 폭주 상품</div>
-                                        </a>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="swiper-slide">
-                                <div class="item_prod">
-                                    <div class="item_state">
-                                        <a href="#none" class="itemLink">
-                                            <div class="itemPic">
-                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
-                                                <button type="button" class="itemLike">관심상품 추가</button>
-                                            </div>
-                                            <p class="itemBrand">BRAND NAME7</p>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<div class="itemcolorchip">
+												<span class="chip_color35" value="ABM">BEIGE</span>
+												<span class="chip_color54" value="BDS">BLACK</span>
+												<span class="chip_color40" value="YBR">WHITE</span>
+											</div>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+											</div>
+											<p class="itemBrand">BRAND NAME7</p>
 
-                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-                                            <p class="itemPrice">80,100
-                                                <span class="itemPrice_original">89,000</span>
-                                                <span class=" itemPercent">10%</span>
-                                            </p>
-                                            <div class="itemcolorchip">
-                                                <span class="chip_color35" value="ABM">BEIGE</span>
-                                                <span class="chip_color54" value="BDS">BLACK</span>
-                                                <span class="chip_color40" value="YBR">WHITE</span>
-                                            </div>
-                                            <div class="itemComment">#주문 폭주 상품</div>
-                                        </a>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="swiper-slide">
-                                <div class="item_prod">
-                                    <div class="item_state">
-                                        <a href="#none" class="itemLink">
-                                            <div class="itemPic">
-                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
-                                                <button type="button" class="itemLike">관심상품 추가</button>
-                                            </div>
-                                            <p class="itemBrand">BRAND NAME8</p>
-                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-                                            <p class="itemPrice">80,100
-                                                <span class="itemPrice_original">89,000</span>
-                                                <span class=" itemPercent">10%</span>
-                                            </p>
-                                            <div class="itemcolorchip">
-                                                <span class="chip_color35" value="ABM">BEIGE</span>
-                                                <span class="chip_color54" value="BDS">BLACK</span>
-                                                <span class="chip_color40" value="YBR">WHITE</span>
-                                            </div>
-                                            <div class="itemComment">#주문 폭주 상품</div>
-                                        </a>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                        <!-- Add Pagination -->
-                        <div class="swiper-pagination"></div>
-                    </div>
-                    <!-- Add Arrows -->
-                    <div class="swiper-button-next"></div>
-                    <div class="swiper-button-prev"></div>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-<!-- // container -->
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<div class="itemcolorchip">
+												<span class="chip_color35" value="ABM">BEIGE</span>
+												<span class="chip_color54" value="BDS">BLACK</span>
+												<span class="chip_color40" value="YBR">WHITE</span>
+											</div>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+											</div>
+											<p class="itemBrand">BRAND NAME8</p>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<div class="itemcolorchip">
+												<span class="chip_color35" value="ABM">BEIGE</span>
+												<span class="chip_color54" value="BDS">BLACK</span>
+												<span class="chip_color40" value="YBR">WHITE</span>
+											</div>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+						<!-- Add Pagination -->
+						<div class="swiper-pagination"></div>
+					</div>
+					<!-- Add Arrows -->
+					<div class="swiper-button-next"></div>
+					<div class="swiper-button-prev"></div>
+				</div>
+			</div>
+		</div>
+	</div>
+	<!-- // container -->
 
 <!-- 쿠폰사용안내 팝업 -->
 <div class="modal fade od_pop cpinfo_pop" id="cpinfoPop" tabindex="-1" role="dialog" aria-labelledby="cpinfoLabel" aria-hidden="true">

+ 345 - 0
src/main/webapp/WEB-INF/views/web/cart/CartListFormWeb_20210319.html

@@ -0,0 +1,345 @@
+<!DOCTYPE html>
+<html lang="ko"
+      xmlns:th="http://www.thymeleaf.org"
+      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+      layout:decorator="web/common/layout/DefaultLayoutWeb">
+
+<!--
+ *******************************************************************************
+ * @source  : cartListFormWeb
+ * @desc    : 장바구니
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.02.02   xodud1202   최초 작성
+ *******************************************************************************
+ -->
+<body>
+
+<th:block layout:fragment="content">
+
+    <!-- payment.js -->
+    <script type="text/javascript" th:src="${@environment.getProperty('pg.kcp.js.url')}" src=""></script>
+    <script type="text/javascript" src="/ux/pc/js/payment.js"></script>
+
+    <!--  container -->
+    <div id="container" class="container od">
+        <div class="wrap">
+            <div class="content shopping_bag"> <!-- 페이지특정 클래스 = shop_bag -->
+                <div class="cont_head">
+                    <h2>쇼핑백</h2>
+                    <div class="oder_steps">
+                        <ul>
+                        <li class="on">01 쇼핑백</li>
+                        <li>02 주문/결제</li>
+                        <li>03 주문완료</li>
+                    </ul>
+                </div>
+            </div>
+            <div id="cartAjaxList" class="cont_body">
+
+            </div>
+        </div>
+        <div class="content shopping_bag mt100">
+            <div class="cont_head">
+                <h4 class="subH1 t_c mb40">추천상품</h4>
+            </div>
+            <div class="cont_body">
+                <div class="od_recommend">
+                    <div class="swiper-container">
+                        <div class="swiper-wrapper">
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
+                                            </div>
+                                            <p class="itemBrand">BRAND NAME1</p>
+                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+                                            <p class="itemPrice">80,100
+                                                <span class="itemPrice_original">89,000</span>
+                                                <span class=" itemPercent">10%</span>
+                                            </p>
+                                            <div class="itemcolorchip">
+                                                <span class="chip_color35" value="ABM">BEIGE</span>
+                                                <span class="chip_color54" value="BDS">BLACK</span>
+                                                <span class="chip_color40" value="YBR">WHITE</span>
+                                            </div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
+                                            </div>
+                                            <p class="itemBrand">BRAND NAME2</p>
+                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+                                            <p class="itemPrice">80,100
+                                                <span class="itemPrice_original">89,000</span>
+                                                <span class=" itemPercent">10%</span>
+                                            </p>
+                                            <div class="itemcolorchip">
+                                                <span class="chip_color35" value="ABM">BEIGE</span>
+                                                <span class="chip_color54" value="BDS">BLACK</span>
+                                                <span class="chip_color40" value="YBR">WHITE</span>
+                                            </div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
+                                            </div>
+                                            <p class="itemBrand">BRAND NAME3</p>
+                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+                                            <p class="itemPrice">80,100
+                                                <span class="itemPrice_original">89,000</span>
+                                                <span class=" itemPercent">10%</span>
+                                            </p>
+                                            <div class="itemcolorchip">
+                                                <span class="chip_color35" value="ABM">BEIGE</span>
+                                                <span class="chip_color54" value="BDS">BLACK</span>
+                                                <span class="chip_color40" value="YBR">WHITE</span>
+                                            </div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
+                                            </div>
+                                            <p class="itemBrand">BRAND NAME4</p>
+                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+                                            <p class="itemPrice">80,100
+                                                <span class="itemPrice_original">89,000</span>
+                                                <span class=" itemPercent">10%</span>
+                                            </p>
+                                            <div class="itemcolorchip">
+                                                <span class="chip_color35" value="ABM">BEIGE</span>
+                                                <span class="chip_color54" value="BDS">BLACK</span>
+                                                <span class="chip_color40" value="YBR">WHITE</span>
+                                            </div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
+                                            </div>
+                                            <p class="itemBrand">BRAND NAME5</p>
+                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+                                            <p class="itemPrice">80,100
+                                                <span class="itemPrice_original">89,000</span>
+                                                <span class=" itemPercent">10%</span>
+                                            </p>
+                                            <div class="itemcolorchip">
+                                                <span class="chip_color35" value="ABM">BEIGE</span>
+                                                <span class="chip_color54" value="BDS">BLACK</span>
+                                                <span class="chip_color40" value="YBR">WHITE</span>
+                                            </div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
+                                            </div>
+                                            <p class="itemBrand">BRAND NAME6</p>
+
+                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+                                            <p class="itemPrice">80,100
+                                                <span class="itemPrice_original">89,000</span>
+                                                <span class=" itemPercent">10%</span>
+                                            </p>
+                                            <div class="itemcolorchip">
+                                                <span class="chip_color35" value="ABM">BEIGE</span>
+                                                <span class="chip_color54" value="BDS">BLACK</span>
+                                                <span class="chip_color40" value="YBR">WHITE</span>
+                                            </div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
+                                            </div>
+                                            <p class="itemBrand">BRAND NAME7</p>
+
+                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+                                            <p class="itemPrice">80,100
+                                                <span class="itemPrice_original">89,000</span>
+                                                <span class=" itemPercent">10%</span>
+                                            </p>
+                                            <div class="itemcolorchip">
+                                                <span class="chip_color35" value="ABM">BEIGE</span>
+                                                <span class="chip_color54" value="BDS">BLACK</span>
+                                                <span class="chip_color40" value="YBR">WHITE</span>
+                                            </div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
+                                            </div>
+                                            <p class="itemBrand">BRAND NAME8</p>
+                                            <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+                                            <p class="itemPrice">80,100
+                                                <span class="itemPrice_original">89,000</span>
+                                                <span class=" itemPercent">10%</span>
+                                            </p>
+                                            <div class="itemcolorchip">
+                                                <span class="chip_color35" value="ABM">BEIGE</span>
+                                                <span class="chip_color54" value="BDS">BLACK</span>
+                                                <span class="chip_color40" value="YBR">WHITE</span>
+                                            </div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <!-- Add Pagination -->
+                        <div class="swiper-pagination"></div>
+                    </div>
+                    <!-- Add Arrows -->
+                    <div class="swiper-button-next"></div>
+                    <div class="swiper-button-prev"></div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+<!-- // container -->
+
+<!-- 쿠폰사용안내 팝업 -->
+<div class="modal fade od_pop cpinfo_pop" id="cpinfoPop" tabindex="-1" role="dialog" aria-labelledby="cpinfoLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="cpinfoLabel">쿠폰사용안내</h5>
+            </div>
+            <div class="modal-body">
+                <div class="pop_cont">
+                    쿠폰사용안내 내용입니다.
+                </div>
+            </div>
+            <div class="modal-footer"></div>
+        </div>
+    </div>
+</div>
+<!-- //쿠폰사용안내 팝업 -->
+
+<script src="/ux/pc/js/swiper.min.js"></script>
+<link rel="stylesheet" type="text/css" href="/ux/pc/css/swiper.min.css" />
+
+<script type="text/javascript">
+    $(document).ready(function() {
+        // 장바구니 상품 정보 select
+        getCartList();
+    });
+
+    function getCartList() {
+        // 장바구니 정보 조회
+        $.ajax( {
+            type: "POST",
+            url : '/cart/goods/list',
+            dataType : 'html',
+            success : function(result) {
+                if (result != null) {
+                    $("#cartAjaxList").html(result);
+                }
+            }
+        });
+    }
+
+    //상품옵션변경 팝업 > 수량조절
+    $(document).on('click','.opt_modify_pop .number_count .minus',function(e){
+        var $input = $(this).parent().find('input');
+        var count = parseInt($input.val()) - 1;
+        count = count < 1 ? 1 : count;
+        $input.val(count);
+        $input.change();
+        return false;
+    }).on('click','.opt_modify_pop .number_count .plus',function(e){
+        var $input = $(this).parent().find('input');
+        $input.val(parseInt($input.val()) + 1);
+        $input.change();
+        return false;
+    });
+
+    //상품옵션변경 팝업 > 컬러선택 표기
+    $(document).on('click','.opt_modify_pop .opt_color ul li a',function(e){
+        $(this).parents('.opt_color').find('li a').removeClass('on');
+        $(this).addClass('on');
+        var optColor = $(this).find("img").attr('alt');
+        $(this).parent().parent().parent().find(".color").text(optColor);
+        return false;
+    });
+
+    $(function(){
+        //추천상품 슬라이드
+        var rcmdItemSwiper = new Swiper('.od_recommend .swiper-container', {
+            slidesPerView: 5,
+            spaceBetween: 0,
+            navigation: {
+                nextEl: '.od_recommend .swiper-button-next',
+                prevEl: '.od_recommend .swiper-button-prev',
+            },
+            pagination: {
+                el: '.od_recommend .swiper-pagination',
+                clickable: true,
+            },
+        });
+    });
+</script>
+</th:block>
+</body>
+</html>

+ 607 - 0
src/main/webapp/WEB-INF/views/web/mypage/MypageCancelFormWeb.html

@@ -0,0 +1,607 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org"
+	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+	layout:decorator="web/common/layout/MypageLayoutWeb">
+<!--
+ *******************************************************************************
+ * @source  : MypageCancelFormWeb.html
+ * @desc    : 마이페이지 > 취소신청 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2021 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.03.19   card007     최초 작성
+ *******************************************************************************
+ -->
+<body>
+
+<th:block layout:fragment="content">
+	<div class="cont">
+		<div class="sec_head">
+			<h3 class="subH1">주문취소</h3>
+			<span class="order_number">주문번호&nbsp;:&nbsp;<em th:text="${cancelList.oneData.ordNo}"></em></span>
+		</div>
+		<div class="sec_body">
+			<div class="part_goods">
+				<div class="goods_head">
+					<p>주문일 <span th:text="${cancelList.oneData.ordDt}"></span></p>
+				</div>
+				<div class="goods_cont">
+					<th:block th:if="${cancelList.cancelList}" th:each="cancel, status : ${cancelList.cancelList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
+					<!-- 주문상품 -->
+					<div class="goods_info">
+						<div class="order_desc">
+							<div class="goods_box">
+								<div class="gd_item">
+									<a href="javascript:void(0)" th:attr="goodsCd=${cancel.goodsCd}" onclick="fnGoToGoodsDetail(this)">
+										<span class="thumb">
+											<img th:src="${imageUrl + '/' + cancel.sysImgNm}" width="100%" alt="">
+										</span>
+										<p>
+											<span class="brand" th:text="${cancel.brandNm}"></span>
+											<span class="tag primary" th:if="${cancel.shotDelvYn == 'Y'}">총알배송</span>
+											<span class="tag" th:if="${cancel.shotDelvYn == 'N' and cancel.selfGoodsYn == 'Y'}">STYLE24 일반배송</span>
+											<span class="tag" th:if="${cancel.selfGoodsYn == 'N'}">업체직배송</span>
+										</p>
+										<p>
+											<span class="name" th:text="${cancel.goodsNm}"></span>
+										</p>
+									</a>
+								</div>
+								<div class="gd_opt">
+									<div class="option_wrap">
+										<span class="title sr-only">주문 옵션</span>
+										<span class="option" th:text="|${cancel.optCd1} / ${cancel.optCd2}|"></span>
+									</div>
+								</div>
+								<div class="gd_calc">
+									<p>
+										<span class="count"><em th:text="${cancel.ordQty}"></em>개</span>
+									</p>
+									<p>
+										<span class="price_org"><em th:text="${#numbers.formatInteger(cancel.listPrice * cancel.ordQty, 1, 'COMMA')}"></em>원</span>
+										<span class="price_sale"><em th:text="${#numbers.formatInteger(cancel.ordAmt, 1, 'COMMA')}"></em>원</span>
+									</p>
+								</div>
+							</div>
+							<div class="button_box">
+								<div class="count_modify">
+									<span class="txt">수량</span>
+									<form class="form_wrap">
+										<div class="form_field">
+											<div class="select_custom select_count">
+												<div class="combo">
+													<input type="hidden" name="chgQty" value="0" th:attr="ordDtlNo=${cancel.ordDtlNo}, ordCanChgQty=${cancel.ordCanChgQty}"/>
+													<div class="select">선택</div>
+													<ul class="list">
+														<li class="selected" value="0">선택</li>
+														<li th:if="${cancel.ordCanChgQty > 0}" th:each="num : ${#numbers.sequence(1,cancel.ordCanChgQty)}" th:value="${num}" th:text="${num}" onclick="fnChangeCancelQty(this);"></li>
+													</ul>
+												</div>
+											</div>
+										</div>
+									</form>
+								</div>
+							</div>
+						</div>
+						<div class="order_text">
+							<p>취소하실 수량을 선택하신 후 주문 취소를 하실 수 있습니다.</p>
+						</div>
+					</div>
+					<!-- //주문상품 -->
+					</th:block>
+				</div>
+			</div>
+			<h4 class="subH3">환불정보</h4>
+			<div class="tbl type6">
+				<table>
+					<colgroup>
+						<col width="50%">
+						<col width="50%">
+					</colgroup>
+					<tr>
+						<td>
+							<dl>
+								<div>
+									<dt>환불 예정 금액</dt>
+									<dd>
+										<div class="price">
+											<span class="return_total_price"><em id="returnAmt">0</em>원</span>
+										</div>
+									</dd>
+								</div>
+								<div class="include_item"> <!-- 할인항목 표기 class명 include_item -->
+									<dt>상품 취소 금액</dt>
+									<dd><em id="goodsCancelAmt">0</em>원</dd>
+								</div>
+								<div class="include_item">
+									<dt>배송비</dt>
+									<dd><em id="deliveryFee">0</em>원</dd>
+								</div>
+								<div class="include_item">
+									<dt>할인 금액 차감</dt>
+									<dd><em id="deductDcAmt">0</em>원</dd>
+								</div>
+							</dl>
+						</td>
+						<td>
+							<dl>
+								<div>
+									<dt>환불 수단</dt>
+									<dd th:text="${paymentInfo.payMeansNm}"></dd>
+								</div>
+								<div>
+									<dt>결제 금액 환불</dt>
+									<dd>
+										<em id="refundPayAmt">0</em>원
+									</dd>
+								</div>
+								<div>
+									<dt>포인트 환불</dt>
+									<dd>
+										<em id="refundPoint">0</em>P
+									</dd>
+								</div>
+								<div>
+									<dt>상품권 환불</dt>
+									<dd>
+										<em id="refundGiftCard">0</em>원
+									</dd>
+								</div>
+							</dl>
+						</td>
+					</tr>
+				</table>
+			</div>
+			<div class="txt_info">
+				<ul>
+					<li>
+						카드사로 결제 취소 요청이 전달된 후 환불까지는 평일 기준 3 ~7일이 소요될 수 있습니다.
+					</li>
+				</ul>
+			</div>
+			<div class="btn_footer_area">
+				<button type="button" class="btn btn_default btn_md"><span>취소</span></button>
+				<button type="button" id="btn_refund_pop" class="btn btn_dark btn_md"><span>주문 취소</span></button>
+			</div>
+		</div>
+	</div>
+	<!-- // CONT-BODY -->
+
+	<!--<div class="my_cont">
+		<div class="sec_head">
+			<h3>반품 신청</h3>
+			<div class="od_detail">
+				(주문번호 : <span class="num" th:text="${ordNo}"></span>)
+			</div>
+		</div>
+		<div class="sec_body mypage_body">
+			<form class="form_wrap" role="form">
+				<div class="order_list">
+					<section class="order_row">
+						<div class="part_deliver">
+							<div class="tbl_tit">
+								&lt;!&ndash; 주문일/선물일 설정 &ndash;&gt;
+								<span class="start_t" th:unless="${returnList.oneData.giftPackYn == 'Y'}">주문일</span>
+								<span class="gift_t" th:if="${returnList.oneData.giftPackYn == 'Y'}">선물일</span>
+								&lt;!&ndash; //주문일/선물일 설정 &ndash;&gt;
+
+								<span class="order_date" th:text="${returnList.oneData.ordDt}"></span>
+
+								&lt;!&ndash; 배송구분 설정 &ndash;&gt;
+								<span class="order_label02" th:if="${returnList.shotDelv}">총알배송</span>
+								<span class="order_label01" th:if="${returnList.selfMall}">STYLE24 일반배송</span>
+								<span class="order_label01" th:if="${returnList.supplyMall}">업체직배송</span>
+								&lt;!&ndash; //배송구분 설정 &ndash;&gt;
+								<a href="javascript:void(0)" class="detail_btn" th:attr="ordNo=${returnList.oneData.ordNo}" onclick="fnGoToOrderDetail(this)">주문상세보기</a>
+							</div>
+							<div class="tbl type2">
+								<table id="returnList">
+									<colgroup>
+										<col width="1020">
+										<col width="180">
+									</colgroup>
+									<tbody>
+									<th:block th:if="${returnList.returnList}" th:each="return, status : ${returnList.returnList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
+										<tr>
+											<td>
+												<div class="info_item">
+													<div class="thumb_box">
+														<a href="">
+															<img th:src="${imageUrl + '/' + return.sysImgNm}" width="100%" alt="">
+														</a>
+													</div>
+													<div class="info_box">
+														<p class="od_name">
+															<a href="">
+																<span class="brand" th:text="${return.brandNm}"></span>
+																<span class="name" th:text="${return.goodsNm}"></span>
+															</a>
+														</p>
+														<p class="od_opt">
+															<span class="option"><em th:text="${return.optCd1}"></em><em th:text="${return.optCd2}"></em></span>
+															<span class="count">수량 <em th:text="${return.ordQty}"></em>개</span>
+														</p>
+													</div>
+													<div class="info_calc">
+														<p class="price">
+															<span class="selling_price" th:text="|${#numbers.formatInteger(return.ordAmt, 1, 'COMMA')}원|"></span>
+														</p>
+														<p class="point"><span th:text="${#numbers.formatInteger(return.savePntAmt, 1, 'COMMA')}"></span>p</p>
+													</div>
+												</div>
+											</td>
+											<td class="cnt_sel">
+												<span class="cnt_t">수량</span>
+												<div class="form_field">
+													<div class="select_custom type1">
+														<div class="combo">
+															<input type="hidden" name="chgQty" value="0" th:attr="ordDtlNo=${return.ordDtlNo}, ordCanChgQty=${return.ordCanChgQty}"/>
+															<div class="select">선택</div>
+															<ul class="list" style="width:100px; margin:0 auto">
+																<li class="selected" value="0">선택</li>
+																<li th:if="${return.ordCanChgQty > 0}" th:each="num : ${#numbers.sequence(1,return.ordCanChgQty)}" th:value="${num}" th:text="${num}" onclick="fnChangeQty(this);"></li>
+															</ul>
+														</div>
+													</div>
+												</div>
+&lt;!&ndash;												<select class="select_dress" name="chgQty" onchange="fnChangeQty();">&ndash;&gt;
+&lt;!&ndash;													<option value="">선택</option>&ndash;&gt;
+&lt;!&ndash;													<option th:if="${return.ordQty > 0}" th:each="num : ${#numbers.sequence(1,return.ordQty)}" th:value="${num}" th:text="${num}"></option>&ndash;&gt;
+&lt;!&ndash;												</select>&ndash;&gt;
+											</td>
+										</tr>
+									</th:block>
+									</tbody>
+								</table>
+							</div>
+							<div class="order_confirm">
+								<p class="cf_txt cf_desc c_primary">반품하실 상품의 수량을 선택하신 후 반품 신청을 하실 수 있습니다.</p>
+							</div>
+						</div>
+					</section>
+					<section class="order_row">
+						<div class="tbl_tit">
+							<h3 class="subH3">반품 사유</h3>
+						</div>
+						<div class="tbl type1">
+							<table>
+								<colgroup>
+									<col width="*">
+								</colgroup>
+								<tbody>
+								<tr>
+									<td>
+										<div class="form_field">
+											<div class="select_custom type1">
+												<div class="combo">
+													<input type="hidden" name="chgReason"/>
+													<div class="select">반품 사유를 선택하세요</div>
+													<ul class="list" style="width:400px">
+														<li class="selected" value="">반품 사유를 선택하세요</li>
+														<li th:if="${returnReason}" th:each="oneData, status : ${returnReason}" th:value="${oneData.cd}" th:text="${oneData.cdNm}" onclick="fnChangeReason(this);"></li>
+													</ul>
+												</div>
+											</div>
+										</div>
+									</td>
+								</tr>
+								<tr>
+									<td>
+										<textarea class="doc_exchange" name="chgMemo" id="chgMemo" placeholder="자세한 사유를 입력해주세요." onkeyup="cfnGetTextLength(this, 200, $('#return_cnt'));"></textarea>
+										<p class="txt_cnt"><span id="return_cnt" class="c_primary">0</span>/200</p>
+									</td>
+								</tr>
+								</tbody>
+							</table>
+						</div>
+					</section>
+					<section class="order_row" id="wdGb">
+						<div class="order_tit">
+							<h3 class="subH3">반품 방식 선택</h3>
+						</div>
+						<div class="tbl type1">
+							<table>
+								<colgroup>
+									<col width="*">
+								</colgroup>
+								<tbody>
+								<tr>
+									<td>
+										<div class="form_field radio_field">
+											<div class="">
+												<input type="radio" name="wdGb" id="withdraw" value="W" checked>
+												<label for="withdraw"><span>방문회수 <b class="c_primary">택배사에서 방문하여 회수</b></span></label>
+											</div>
+											<div class="">
+												<input type="radio" name="wdGb" id="direct" value="D">
+												<label for="direct"><span>직접반송 <b class="c_primary">고객이 직접 반송처리</b></span></label>
+											</div>
+										</div>
+									</td>
+								</tr>
+								</tbody>
+							</table>
+						</div>
+					</section>
+					<section class="order_row" id="chgerLocation">
+						<div class="order_tit">
+							<h3 class="subH3">상품 회수지</h3>
+							<span class="del_t">택배사에서 반품 상품을 직접 회수할 장소 선택</span>
+							<button type="button" class="btn_popup" onclick="fnChangeDeliveryAddr('chger');"><span>회수지 선택</span></button>
+						</div>
+						<div class="tbl type1">
+							<table>
+								<colgroup>
+									<col width="200">
+									<col width="*">
+								</colgroup>
+								<tbody>
+								<tr>
+									<th>성명</th>
+									<td id="chgerNm" th:text="${deliveryAddrInfo.recipNm}"></td>
+									<input type="hidden" name="chgerNm" th:value="${deliveryAddrInfo.recipNm}">
+								</tr>
+								<tr>
+									<th>연락처</th>
+									<td id="chgerPhnno" th:text="${deliveryAddrInfo.recipPhnno}"></td>
+									<input type="hidden" name="chgerPhnno" th:value="${deliveryAddrInfo.recipPhnno}">
+								</tr>
+								<tr>
+									<th>주소</th>
+									<td id="chgerAddr" th:text="|${deliveryAddrInfo.recipBaseAddr} ${deliveryAddrInfo.recipDtlAddr}|"></td>
+									<input type="hidden" name="chgerBaseAddr" th:value="${deliveryAddrInfo.recipBaseAddr}">
+									<input type="hidden" name="chgerDtlAddr" th:value="${deliveryAddrInfo.recipDtlAddr}">
+								</tr>
+								</tbody>
+							</table>
+						</div>
+					</section>
+					<section class="order_row" id="returnLocation" style="display:none">
+						<div class="order_tit">
+							<h3 class="subH3">반품하실 배송지</h3>
+						</div>
+						<div class="tbl type1">
+							<table>
+								<colgroup>
+									<col width="200">
+									<col width="*">
+								</colgroup>
+								<tbody>
+								<tr>
+									<th>성명</th>
+									<td th:text="${deliveryAddrInfo.rtnLocNm}"></td>
+									<input type="hidden" name="rtnLocNm" th:value="${deliveryAddrInfo.rtnLocNm}">
+								</tr>
+								<tr>
+									<th>연락처</th>
+									<td th:text="${deliveryAddrInfo.rtnLocTelno}"></td>
+									<input type="hidden" name="rtnLocTelno" th:value="${deliveryAddrInfo.rtnLocTelno}">
+								</tr>
+								<tr>
+									<th>주소</th>
+									<td th:text="|${deliveryAddrInfo.rtnLocBaseAddr} ${deliveryAddrInfo.rtnLocDtlAddr}|"></td>
+									<input type="hidden" name="rtnLocBaseAddr" th:value="${deliveryAddrInfo.rtnLocBaseAddr}">
+									<input type="hidden" name="rtnLocDtlAddr" th:value="${deliveryAddrInfo.rtnLocDtlAddr}">
+								</tr>
+								</tbody>
+							</table>
+						</div>
+					</section>
+					<section class="order_row">
+						<div class="order_tit">
+							<h3 class="subH3">환불 정보</h3>
+							<button type="button" class="btn_popup"><span>취소 전표 보기</span></button>
+						</div>
+						<div class="tbl type1 re_info_tbl">
+							<div class="r_left">
+								<dl>
+									<dt>환불(예정) 금액</dt>
+									<dd>
+										<span class="big_t"><strong id="returnAmt">0</strong>원</span>
+									</dd>
+								</dl>
+								<dl>
+									<dt>상품취소 금액</dt>
+									<dd>
+										<span id="goodsCancelAmt">0</span>원
+									</dd>
+								</dl>
+								<dl>
+									<dt>배송비</dt>
+									<dd>
+										<span id="deliveryFee">0</span>원
+									</dd>
+								</dl>
+								<dl>
+									<dt>할인금액 차감</dt>
+									<dd>
+										<span id="deductDcAmt">0</span>원
+									</dd>
+								</dl>
+							</div>
+							<div class="r_right">
+								<dl>
+									<dt>환불수단</dt>
+									<dd>
+										<span th:text="${paymentInfo.payMeansNm}"></span>
+									</dd>
+								</dl>
+								<dl>
+									<dt>결제금액 환불</dt>
+									<dd>
+										<span id="refundPayAmt">0</span>원
+									</dd>
+								</dl>
+								<dl>
+									<dt>포인트 환불</dt>
+									<dd>
+										<span id="refundPoint">0</span>P
+									</dd>
+								</dl>
+								<dl>
+									<dt>상품권 환불</dt>
+									<dd>
+										<span id="refundGiftCard">0</span>원
+									</dd>
+								</dl>
+							</div>
+						</div>
+						<p class="alert_t">※ 카드사로 결제 취소 요청이 전달된 후 환불까지는 평일 기준 3 ~7일이 소요될 수 있습니다.</p>
+					</section>
+					<section class="order_row" id="addDeliveryFee" style="display:none">
+						<div class="ship_fee">
+							<p><span class="c_primary" id="addPayCost">2,500원</span> 배송비 추가 결제가 필요합니다.</p>
+							<input type="hidden" name="addPayCost"/>
+						</div>
+					</section>
+					<div class="btn_wrap">
+						<button type="button" class="btn btn_default cancle_btn" onclick="cfnGoToPage(_PAGE_MYPAGE_CRS_LIST)"><span>반품 취소</span></button>
+						<button tyep="submit" class="btn btn_primary submit_btn" onclick="fnReturn()"><span id="returnButton">반품 신청</span></button>
+					</div>
+				</div>
+			</form>
+		</div>
+	</div>-->
+<script src="/ux/plugins/gaga/gaga.paging.js"></script>
+<script th:inline="javascript">
+	let cancelList = [[${cancelList}]];
+	let usedGiftCardInfo = [[${usedGiftCardInfo}]];
+	let usedPointInfo = [[${usedPointInfo}]];
+
+	$(document).ready(function() {
+		// 마이페이지 LNB 설정
+		fnSetMypageLnbList(2);
+		
+		// 마이페이지 location 설정
+		fnSetMypageLocation('취소/반품/환불내역', '_PAGE_MYPAGE_CRS_LIST', '취소 신청');
+		
+		// 셀렉트박스 활성화
+		var goods_count_selecter = new sCombo('.myOrderView .part_goods .select_custom.select_count');
+	});
+	
+	// 취소 처리
+	var fnCancel = function() {
+		// TODO
+		// 취소신청 처리
+	}
+	
+	// 취소 수량 변경 이벤트 처리
+	var fnChangeCancelQty = function(param) {
+		let url = '/mypage/cancel/refund/amt/calculate';
+
+		if (param != null) {
+			$(param).parent().parent().find('input[name=chgQty]').val($(param).val());
+		}
+
+		let cancelRequestList = [];
+
+		// 취소 수량 설정
+		let chgQtyArr = [];
+		let ordDtlNoArr = [];
+		let ordCanChgQtyArr = [];
+		let chgQtyChk = 0;
+		$.each($('input[name=chgQty]'), function(idx, item) {
+			let chgQty = $(item).val();
+			let ordDtlNo = $(item).attr('ordDtlNo');
+			let ordCanChgQty = $(item).attr('ordCanChgQty');
+
+			chgQtyArr.push(Number(chgQty));
+			ordDtlNoArr.push(Number(ordDtlNo));
+			ordCanChgQtyArr.push(Number(ordCanChgQty));
+			
+			chgQtyChk += Number(chgQty);
+		});
+
+		if (chgQtyChk > 0) {
+			// 환불포인트, 환불상품권 금액 계산
+			let refundPoint = fnCalculatePoint(chgQtyArr, ordDtlNoArr, ordCanChgQtyArr);
+			let refundGiftCard = fnCalculateGiftCard(chgQtyArr, ordDtlNoArr, ordCanChgQtyArr);
+			
+			$.each(cancelList, function (idx, item) {
+				let index = ordDtlNoArr.indexOf(item.ordDtlNo);
+				item.ordCanChgQty = chgQtyArr[index];
+				
+				cancelRequestList.push(item);
+			})
+			
+			let jsonData = JSON.stringify(cancelRequestList);
+			
+			gagajf.ajaxJsonSubmit(url, jsonData, function (result) {
+				let spanCnclRtnAmt = Number(result.spanCnclRtnAmt);
+				let sumDeliveryFee = Number(result.sumDeliveryFee);
+				let spanTotDeliveryFee = Number(result.spanTotDeliveryFee);
+				let spanCpnDcAmt = Number(result.spanCpnDcAmt);
+				let spanTmtbDcAmt = Number(result.spanTmtbDcAmt);
+				let spanPrePntDcAmt = Number(result.spanPrePntDcAmt);
+				let spanRefundAmt = Number(result.spanRefundAmt);
+				
+				let goodsCancelAmt = spanCnclRtnAmt;										// 상품취소금액
+				let deliveryFee = sumDeliveryFee - spanTotDeliveryFee;						// 배송비
+				let deductDcAmt = 0 - spanCpnDcAmt - spanTmtbDcAmt - spanPrePntDcAmt;		// 할인금액 차감(쿠폰+다다익선+선포인트)
+				let refundPayAmt = spanRefundAmt;											// 결제금액 환불
+				let returnAmt = refundPayAmt + refundPoint + refundGiftCard;				// 환불예정금액
+				
+				// 금액 설정
+				$('#returnAmt').text(returnAmt.addComma());
+				$('#goodsCancelAmt').text(goodsCancelAmt.addComma());
+				$('#deliveryFee').text(deliveryFee.addComma());
+				$('#deductDcAmt').text(deductDcAmt.addComma());
+				$('#refundPayAmt').text(refundPayAmt.addComma());
+				$('#refundPoint').text(refundPoint.addComma());
+				$('#refundGiftCard').text(refundGiftCard.addComma());
+				console.log(result);
+			});
+		}
+	}
+
+	// 환불 포인트 계산
+	var fnCalculatePoint = function(chgQtyArr, ordDtlNoArr, ordCanChgQtyArr) {
+		let refundPoint = 0;
+
+		$.each(usedPointInfo, function(idx, item) {
+			let index = ordDtlNoArr.indexOf(item.ordDtlNo);
+			let chgQty = chgQtyArr[index];
+			let ordCanChgQty = ordCanChgQtyArr[index];
+			
+			if (chgQty > 0) {
+				if (chgQty == ordCanChgQty) {
+					refundPoint += item.pntAmt;
+				} else {
+					refundPoint += item.pntAmt * (chgQty / ordCanChgQty);
+				}
+			}
+		});
+		
+		return refundPoint;
+	}
+	
+	// 환불 상품권 계산
+	var fnCalculateGiftCard = function(chgQtyArr, ordDtlNoArr, ordCanChgQtyArr) {
+		let refundGiftCard = 0;
+		
+		$.each(usedGiftCardInfo, function(idx, item) {
+			let index = ordDtlNoArr.indexOf(item.ordDtlNo);
+			let chgQty = chgQtyArr[index];
+			let ordCanChgQty = ordCanChgQtyArr[index];
+			
+			if (chgQty > 0) {
+				if (chgQty == ordCanChgQty) {
+					refundGiftCard += item.gfcdAmt;
+				} else {
+					refundGiftCard += item.pntAmt * (chgQty / ordCanChgQty);
+				}
+			}
+		});
+		
+		return refundGiftCard;
+	}
+</script>
+
+</th:block>
+
+</body>
+</html>

+ 21 - 19
src/main/webapp/WEB-INF/views/web/mypage/MypageOrderListFormWeb.html

@@ -237,15 +237,21 @@
 		</form>
 		<form id="exchangeForm" name="exchangeForm" action="#" th:action="@{'/mypage/exchange/form'}" th:method="post">
 			<input type="hidden" name="ordNo"/>
-			<input type="hidden" name="ordDtlNoArr"/>
+			<input type="hidden" name="ordDtlNo"/>
+			<input type="hidden" name="supplyCompCd"/>
+		</form>
+		<form id="returnForm" name="returnForm" action="#" th:action="@{'/mypage/return/form'}" th:method="post">
+			<input type="hidden" name="ordNo"/>
+			<input type="hidden" name="ordDtlNo"/>
+			<input type="hidden" name="supplyCompCd"/>
 		</form>
 		<form id="cancelForm" name="cancelForm" th:action="@{'/mypage/cancel/form'}" th:method="post">
 			<input type="hidden" name="ordNo"/>
-			<input type="hidden" name="ordDtlNoArr"/>
+			<input type="hidden" name="ordDtlNo"/>
 		</form>
 		<form id="reviewForm" name="reviewForm" th:action="@{'/mypage/review/form'}" th:method="post">
 			<input type="hidden" name="ordNo"/>
-			<input type="hidden" name="ordDtlNoArr"/>
+			<input type="hidden" name="ordDtlNo"/>
 		</form>
 	</div>
 <script src="/ux/plugins/gaga/gaga.paging.js"></script>
@@ -418,12 +424,11 @@
 				tag += '	</div>\n';
 				tag += '	<div class="goods_cont">\n';
 				$.each(order.ordDtlList, function (index, ordDtl) {
-					console.log(ordDtl);
 					tag += '		<div class="goods_info">\n';
 					tag += '			<div class="order_desc">\n';
 					tag += '				<div class="goods_box">\n';
 					tag += '					<div class="gd_item">\n';
-					tag += '						<a href="">\n';
+					tag += '						<a href="javascript:void(0)" goodsCd="' + ordDtl.goodsCd + '" onclick="fnGoToGoodsDetail(this)">\n';
 					tag += '							<span class="thumb">\n';
 					tag += '								<img src="' + imageUrl + '/' + ordDtl.sysImgNm + '" width="100%" alt="">\n';
 					tag += '							</span>\n';
@@ -454,7 +459,7 @@
 					tag += '							<span class="count"><em>' + ordDtl.ordQty + '</em>개</span>\n';
 					tag += '						</p>\n';
 					tag += '						<p>\n';
-					tag += '							<span class="price_org"><em>' + ordDtl.listPrice.addComma() + '</em>원</span>\n';
+					tag += '							<span class="price_org"><em>' + (ordDtl.listPrice * ordDtl.ordQty).addComma() + '</em>원</span>\n';
 					tag += '							<span class="price_sale"><em>' + ordDtl.ordAmt.addComma() + '</em>원</span>\n';
 					tag += '						</p>\n';
 					tag += '					</div>\n';
@@ -493,22 +498,19 @@
 
 						// 교환신청 버튼(배송중, 출고완료, 배송완료)
 						if (ordDtl.ordDtlStat == 'G013_50' || ordDtl.ordDtlStat == 'G013_55' || ordDtl.ordDtlStat == 'G013_60') {
-							console.log(ordDtl);
-							console.log(ordDtl.changeableYn);
-							console.log(ordDtl.returnableYn);
 							// 교환/반품 가능한 상품
 							if (ordDtl.changeableYn == 'Y' && ordDtl.returnableYn == 'Y') {
-								tag += '					<p><button type="button" class="btn btn_default btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" onclick="fnCreateChange(this, \'exchange\');"><span>교환 신청</span></button></p>\n';
-								tag += '					<p><button type="button" class="btn btn_default btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" onclick="fnCreateChange(this, \'return\');"><span>반품 신청</span></button></p>\n';
+								tag += '					<p><button type="button" class="btn btn_default btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" supplyCompCd="' + ordDtl.supplyCompCd + '" onclick="fnCreateChange(this, \'exchange\');"><span>교환 신청</span></button></p>\n';
+								tag += '					<p><button type="button" class="btn btn_default btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" supplyCompCd="' + ordDtl.supplyCompCd + '" onclick="fnCreateChange(this, \'return\');"><span>반품 신청</span></button></p>\n';
 							}
 							// 교환 신청 불가 상품
 							else if (ordDtl.changeableYn == 'N' && ordDtl.returnableYn == 'Y') {
 								tag += '					<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA);"><span>1:1 문의</span></button></p>\n';
-								tag += '					<p><button type="button" class="btn btn_default btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" onclick="fnCreateChange(this, \'return\');"><span>반품 신청</span></button></p>\n';
+								tag += '					<p><button type="button" class="btn btn_default btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" supplyCompCd="' + ordDtl.supplyCompCd + '" onclick="fnCreateChange(this, \'return\');"><span>반품 신청</span></button></p>\n';
 							}
 							// 반품 신청 불가 상품
 							else if (ordDtl.changeableYn == 'Y' && ordDtl.returnableYn == 'N') {
-								tag += '					<p><button type="button" class="btn btn_default btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" onclick="fnCreateChange(this, \'exchange\');"><span>교환 신청</span></button></p>\n';
+								tag += '					<p><button type="button" class="btn btn_default btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" supplyCompCd="' + ordDtl.supplyCompCd + '" onclick="fnCreateChange(this, \'exchange\');"><span>교환 신청</span></button></p>\n';
 								tag += '					<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA);"><span>1:1 문의</span></button></p>\n';
 							}
 							// 교환/반품 신청 불가 상품
@@ -524,12 +526,7 @@
 
 						// 구매확정 버튼(배송완료)
 						if (ordDtl.ordDtlStat == 'G013_60') {
-							tag += '					<p><button type="button" class="btn btn_default btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" onclick="fnDecideOrder(this);"><span>구매 확정</span></button></p>\n';
-						}
-
-						// 쇼핑백담기 버튼(구매확정)
-						if (ordDtl.ordDtlStat == 'G013_70') {
-							tag += '					<p><button type="button" class="btn btn_primary_line btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" onclick="fnCreateCart(this);"><span>쇼핑백 담기</span></button></p>\n';
+							tag += '					<p><button type="button" class="btn btn_primary_line btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" onclick="fnDecideOrder(this);"><span>구매 확정</span></button></p>\n';
 						}
 
 						// 리뷰작성 버튼(구매확정)
@@ -537,6 +534,11 @@
 							tag += '					<p><button type="button" class="btn btn_primary_line btn_sm" ordNo="' + ordDtl.ordNo + '" onclick="fnCreateReview(this);"><span>리뷰 쓰기</span></button></p>\n';
 						}
 
+						// 쇼핑백담기 버튼(구매확정)
+						if (ordDtl.ordDtlStat == 'G013_70') {
+							tag += '					<p><button type="button" class="btn btn_default btn_sm" ordNo="' + ordDtl.ordNo + '" ordDtlNo="' + ordDtl.ordDtlNo + '" onclick="fnCreateCart(this);"><span>쇼핑백 담기</span></button></p>\n';
+						}
+
 						// 1:1문의 버튼(구매확정)
 						if (ordDtl.ordDtlStat == 'G013_70' && (ordDtl.reviewableYn == 'N' || ordDtl.reviewSq > 0)) {
 							tag += '					<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA);"><span>1:1 문의</span></button></p>\n';

+ 6 - 2
src/main/webapp/WEB-INF/views/web/order/OrderCustemerInfoWeb.html

@@ -21,7 +21,7 @@
 				<span>주문고객</span>
 			</div>
 			<div class="data">
-				<span th:text="${custemerInfo.ordNm}"></span> 
+				<span th:text="${custemerInfo.custNm}"></span> 
 				<span th:text="${custemerInfo.email}"></span> 
 				<span th:text="${custemerInfo.cellPhnno}"></span>
 			</div>
@@ -29,13 +29,17 @@
 	</a>
 </div>
 <div class="fold_cont" style="display: none;">
+	<input type="hidden" name="custNm" 		th:value="${custemerInfo.custNm}"/>
+	<input type="hidden" name="email" 		th:value="${custemerInfo.email}"/>
+	<input type="hidden" name="cellPhnno" 	th:value="${custemerInfo.cellPhnno}"/>
+	
 	<div class="area_mbinfo">
 		<dl>
 			<div>
 				<dt>
 					<span class="sr-only">주문자명</span>
 				</dt>
-				<dd th:text="${custemerInfo.ordNm}"></dd>
+				<dd th:text="${custemerInfo.custNm}"></dd>
 			</div>
 			<div>
 				<dt>

+ 85 - 146
src/main/webapp/WEB-INF/views/web/order/OrderDcAmtInfoWeb.html

@@ -13,8 +13,9 @@
  * 1.0  2021.02.01   jsh77b     최초 작성
  *******************************************************************************
  -->
+
 <!-- 할인/혜택 사용 -->
-<div class="fold_head">
+<div class="fold_head on">
 	<a href="javascript:void(0)">
 		<div>
 			<div class="fold_tit">
@@ -24,155 +25,81 @@
 				<div class="form_field">
 					<input id="chk-maxdisc" type="checkbox" checked="">
 					<label for="chk-maxdisc">
-						<span>최대 할인혜택을 바로 적용하세요 <em class="maxdisc_amount"></em></span>
+						<span>최대 할인혜택을 바로 적용하세요!</span>&nbsp;
+						<span class="maxdisc_amount">(<em class="cpnDcAmt"></em>원 할인)</span>
 					</label>
 				</div>
 			</div>
 		</div>
 	</a>
 </div>
-<div class="fold_cont" style="display: none;">
+<div class="fold_cont" style="display: block;">
 	<div class="area_seldiscount">
 		<dl>
 			<div>
-				<dt><span class="mid">할인코드</span></dt>
+				<dt>할인쿠폰</dt>
 				<dd>
-					<div class="form_field">
-						<div class="input_wrap">
-							<input type="text" id="serialCpnNm" class="form_control" maxlength="13" placeholder="할인코드를 입력해주세요.">
-							<button type="button" class="btn btn_dark" onclick="serialCpnApply()">적용</button>
+					<div class="sale_coupon_box">
+						<div>
+							<span class="maxdisc_amount">총&nbsp;<em class="cpnDcAmt"></em>원 할인</span>
+							<button id="btn_couponModify_pop" class="btn btn_default btn_sm">
+								<span>쿠폰변경</span>
+							</button>
+						</div>
+						<div class="form_field">
+							<div class="input_wrap">
+								<input type="text" id="serialCpnNm" class="form_control" maxlength="13" placeholder="할인코드를 입력해주세요.">
+								<button type="button" class="btn btn_dark btn_sm" onclick="serialCpnApply()">
+									<span>적용</span>
+								</button>
+							</div>
 						</div>
 					</div>
 				</dd>
 			</div>
-			<div id="custCpnInfo" style="display:none">
-				<dt>할인쿠폰</dt>
-				<dd>
-					<a href="javascript:void(0);" class="btn_coupon_toggle">할인쿠폰 <span id="cpnApplyCnt"></span>적용</a>
-					<div class="coupon_list">
-						<ul>
-							<!--  상품쿠폰 -->
-							<th:block th:each="goods, i : ${goodsApplyCpnList}">
-								<th:block th:if="${goods.goodsCpnList.size() > 0}">
-									<li>
-										<div class="coupon">
-											<div class="item_gd">
-												<figure>
-													<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
-													<figcaption>
-														<div class="brand" th:text="${goods.brandEnm}+' '+${goods.brandKnm}"></div>
-														<div class="name" th:text="${goods.goodsNm}"></div>
-														<div class="price">
-															<th:block th:if="${goods.tmtbDcAmt} > 0">
-																<span class="selling_price"  th:text="${#numbers.formatInteger(goods.tmtbDcAmt, 1, 'COMMA')}"></span>
-															</th:block>
-															<th:block th:if="${goods.tmtbDcAmt} < 1">
-																<span class="selling_price"  th:text="${#numbers.formatInteger(goods.currPrice, 1, 'COMMA')}"></span>
-															</th:block>
-														</div>
-													</figcaption>
-												</figure>
-											</div>
-											 
-											<div class="form_field">
-												<div class="select_custom type1">
-													<div class="combo">
-														<input type="hidden" name="cpnType" value="goodsCpn"/>
-														<input type="hidden" name="cpnCartSq" th:value="${goods.cartSq}"/>
-														<input type="hidden" name="custCpnSq" value="0"/>
-														<input type="hidden" name="cpnDcAmt" value="0"/>
+			
+			<th:block th:if="${delvCpnList.size() > 0}">
+				<div>
+					<dt>배송비 쿠폰</dt>
+					<dd>
+						<div class="dlvr_fee_box">
+							<div class="form_field">
+								<div class="select_custom coupon_list">
+									<div class="combo">
+										<input type="hidden" name="cpnType" value="delvCpn"/>
+										<input type="hidden" name="custCpnSq" value="0"/>
+										<input type="hidden" name="cpnDcAmt" value="0"/>
+										<input type="hidden" name="delvFeeCd" value="0"/>
 														
-														<div class="select">선택없음</div>
-														<ul class="list">
-															<li value="0">선택없음</li>
-															<th:block th:each="goodsCpn, k : ${goods.goodsCpnList}">
-																<li th:value="${goodsCpn.custCpnSq}" th:data="${goodsCpn.cpnDcAmt}" th:text="${goodsCpn.cpnNm}"></li>
-															</th:block>
-														</ul>
-													</div>
-												</div>
-											</div>
-											<div class="cp_discount" style="display:none;">
-												<span class="cp_amount"></span>
-												<button type="button" class="btn_del_coupon"><span>쿠폰적용해제</span></button>
-											</div>
-										</div>
-									</li>
-								</th:block>
-							</th:block>
-							<!--  상품쿠폰 -->
-
-							<!--  장바구니쿠폰 -->
-							<th:block th:if="${cartCpnList.size() > 0}">
-								<li>
-									<div class="coupon">
-										<div class="form_field">
-											<div class="select_custom type1">
-												<div class="combo">
-													<input type="hidden" name="cpnType" value="cartCpn"/>
-													<input type="hidden" name="custCpnSq" value="0"/>
-													<input type="hidden" name="cpnDcAmt" value="0"/>
-													
-													<div class="select">선택없음</div>
-													<ul class="list">
-														<li value="0">선택없음</li>
-														<th:block th:each="cartCpn, k : ${cartCpnList}">
-															<li th:value="${cartCpn.custCpnSq}" th:data="${cartCpn.cpnDcAmt}">
-																<th:block th:text="${cartCpn.cpnNm}"></th:block>
-																<input type="hidden" name="dcWay" th:value="${cartCpn.dcWay}"/>
-																<input type="hidden" name="dcVal" th:value="${cartCpn.dcVal}"/>
-																<th:block th:each="cartCpnCartSq, kokok : ${cartCpn.cartCpnCartSqArr}"> 
-																	<input type="hidden" name="cartCpnCartSq" th:value="${cartCpnCartSq}" />
-																</th:block>
-															</li>
-														</th:block>
-													</ul>
-												</div>
-											</div>
-										</div>
-										<div class="cp_discount">
-											<span class="cp_amount"></span>
-											<button type="button" class="btn_del_coupon"><span>쿠폰적용해제</span></button>
-										</div>
-									</div>
-								</li>
-							</th:block>
-							<!--  장바구니쿠폰 -->
-							
-							<!--  배송비쿠폰 -->
-							<th:block th:if="${delvCpnList.size() > 0}">
-								<li>
-									<div class="coupon">
-										<div class="form_field">
-											<div class="select_custom type1">
-												<div class="combo">
-													<input type="hidden" name="cpnType" value="delvCpn"/>
-													<input type="hidden" name="custCpnSq" value="0"/>
-													<input type="hidden" name="cpnDcAmt" value="0"/>
-													<input type="hidden" name="delvFeeCd" value="0"/>
-													
-													<div class="select" value="0">선택없음</div>
-													<ul class="list">
-														<li value="0">선택없음</li>
-														<th:block th:each="delvCpn, k : ${delvCpnList}">
-															<li th:value="${delvCpn.custCpnSq}" th:data="${delvCpn.dcVal}" th:delvfeecd="${delvCpn.delvFeeCd}" th:delvfee="${delvCpn.delvFee}" th:text="${delvCpn.cpnNm}"></li>
-														</th:block>
-													</ul>
-												</div>
-											</div>
-										</div>
-										<div class="cp_discount">
-											<span class="cp_amount"></span>
-											<button type="button" class="btn_del_coupon"><span>쿠폰적용해제</span></button>
+										<div class="select">
+											<div class="dlvr_coupon"><p class="empty">선택</p></div>
 										</div>
+										<ul class="list" style="display: none;">
+											<th:block th:each="delvCpn, k : ${delvCpnList}">
+												<!-- <li class="selected"> -->
+												<li th:value="${delvCpn.custCpnSq}" th:data="${delvCpn.dcVal}" th:delvfeecd="${delvCpn.delvFeeCd}" th:delvfee="${delvCpn.delvFee}">
+													<div class="dlvr_coupon">
+														<input type="hidden" name="dcWay" th:value="${cartCpn.dcWay}"/>
+														<input type="hidden" name="dcVal" th:value="${cartCpn.dcVal}"/>
+														<p class="name" th:text="${delvCpn.cpnNm}"></p>
+														<!-- 
+														<p class="txt"><span th:text="${cartCpn.buyLimitAmt}">30,000</span>원 이상 구매시 최대 <span th:text="${cartCpn.maxDcAmt}">3,000</span>원 할인</p>
+														 -->
+														<p class="discount"><span th:text="${delvCpn.dcVal}"></span>원 할인</p>
+													</div>
+												</li>
+											</th:block>
+											<li>
+												<div class="dlvr_coupon"><p class="empty">적용 안함</p></div>
+											</li>
+										</ul>
 									</div>
-								</li>
-							</th:block>
-							<!--  배송비쿠폰 -->
-						</ul>
-					</div>
-				</dd>
-			</div>
+								</div>
+							</div>
+						</div>
+					</dd>
+				</div>
+			</th:block>
 		</dl>
 	</div>
 	
@@ -180,6 +107,7 @@
 	<th:block th:if="${prePntDcAmt} > 0 or ${rmPntAmt} > 0 or ${rmGfcdAmt} > 0">
 		<div class="area_selpoint">
 			<dl>
+				<!-- 선포인트금액, 포인트금액, 상품권금액 0보다 클때 적용 -->
 				<th:block th:if="${prePntDcAmt} > 0">
 					<div>
 						<dt>선 포인트 사용</dt>
@@ -187,23 +115,22 @@
 							<div class="form_field">
 								<input type="hidden" name="rmPrePntAmt" th:value="${prePntDcAmt}"/>
 								<div>
-									<input type="radio" name="rdi-beforpoint" id="rdi-beforpoint1" value="N"> 
+									<input type="radio" name="rdi-beforpoint" id="rdi-beforpoint1"value="N" checked=""> 
 									<label for="rdi-beforpoint1"><span>사용 안함</span></label>
 								</div>
 								<div>
 									<input type="radio" name="rdi-beforpoint" id="rdi-beforpoint2" value="Y"> 
 									<label for="rdi-beforpoint2"><span>사용함</span></label> 
-									<span class="remain_point" th:text="|사용가능 포인트 : ${#numbers.formatInteger(prePntDcAmt, 1, 'COMMA')} P|"></span>
+									<span class="useable_point">(<em th:text="${#numbers.formatInteger(prePntDcAmt, 1, 'COMMA')"></em>&nbsp;사용 가능)</span>
 								</div>
 							</div>
 						</dd>
 					</div>
 				</th:block>
+				
 				<th:block th:if="${rmPntAmt} > 0">
 					<div>
-						<dt>
-							<span class="mid">스타일 포인트</span>
-						</dt>
+						<dt>스타일 포인트</dt>
 						<dd>
 							<div class="form_field">
 								<input type="hidden" name="rmPntAmt" th:value="${rmPntAmt}"/>
@@ -211,35 +138,47 @@
 								<th:block th:if="${orgGoodsSumAmt} >= 30000">
 									<div class="input_wrap">
 										<input type="text" name="pntDcAmtStr" class="form_control" maxlength="" placeholder="사용할 포인트를 입력해주세요.">
-										<button type="button" class="btn btn_dark" id="btn_point_apply">적용</button>
+										<button type="button" class="btn btn_dark btn_sm">
+											<span>적용</span>
+										</button>
 									</div>
-									<p><span class="remain_point rmPntAmt" th:text="|보유 : ${#numbers.formatInteger(rmPntAmt, 1, 'COMMA')} P|"></span>(결제금액의 최대 40%까지 사용가능)</p>
 								</th:block>
 								<!-- 스타일 포인트 3만원 이상 결제시 노출 -->
 								
 								<!-- 스타일 포인트 3만원 미만 결제시 노출 -->
 								<th:block th:if="${orgGoodsSumAmt} < 30000">
 									<div class="input_wrap">
-										<input type="text" class="form_control" maxlength="" placeholder="3만원 이상 결제시에만 포인트 사용이 가능합니다." disabled>
+										<input type="text" class="form_control" maxlength="" placeholder="3만원 이상 결제시에만 포인트 사용이 가능합니다." disabled="">
 									</div>
 								</th:block>
+								<!-- //스타일 포인트 3만원 미만 결제시 노출 -->
+								
+								<p>
+									<span class="remain_point">보유:&nbsp;
+										<em class="rmPntAmt" th:text="${#numbers.formatInteger(rmPntAmt, 1, 'COMMA')"></em>P
+									</span>(결제금액의 최대 40%까지 사용가능)
+								</p>
 							</div>
 						</dd>
 					</div>
 				</th:block>
+				
 				<th:block th:if="${rmGfcdAmt} > 0">
 					<div>
-						<dt>
-							<span class="mid">상품권</span>
-						</dt>
+						<dt>상품권</dt>
 						<dd>
 							<div class="form_field">
 								<input type="hidden" name="rmGfcdAmt" th:value="${rmGfcdAmt}"/>
 								<div class="input_wrap">
 									<input type="text" name="gfcdUseAmtStr" class="form_control" maxlength="" placeholder="사용할 금액을 입력해주세요.">
-									<button type="button" class="btn btn_dark" id="btn_gfcd_apply">적용</button>
+									<button type="button" class="btn btn_dark btn_sm">
+										<span>적용</span>
+									</button>
 								</div>
-								<p><span class="remain_point" th:text="|보유 : ${#numbers.formatInteger(rmGfcdAmt, 1, 'COMMA')} 원|"></span></p>
+								<p>
+									<span class="remain_point">보유:&nbsp;<em th:text="${#numbers.formatInteger(rmGfcdAmt, 1, 'COMMA')}"></em>원
+									</span>
+								</p>
 								<div class="agree_receipt">
 									<input id="chk-receipt" type="checkbox"> 
 									<label for="chk-receipt"><span>상품권 현금영수증 신청</span></label>

+ 286 - 0
src/main/webapp/WEB-INF/views/web/order/OrderDcAmtInfoWeb_20210318.html

@@ -0,0 +1,286 @@
+<!DOCTYPE html>
+<html lang="ko" xmlns:th="http://www.thymeleaf.org">
+<!--
+ *******************************************************************************
+ * @source  : OrderDcAmtInfoWeb.html
+ * @desc    : 할인혜택 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.02.01   jsh77b     최초 작성
+ *******************************************************************************
+ -->
+<div class="fold_head">
+	<a href="javascript:void(0)">
+		<div>
+			<div class="fold_tit">
+				<span>할인/혜택 사용</span>
+			</div>
+			<div class="data maxdisc">
+				<div class="form_field">
+					<input id="chk-maxdisc" type="checkbox" checked="">
+					<label for="chk-maxdisc">
+						<span>최대 할인혜택을 바로 적용하세요 <em class="maxdisc_amount"></em></span>
+					</label>
+				</div>
+			</div>
+		</div>
+	</a>
+</div>
+<div class="fold_cont" style="display: none;">
+	<div class="area_seldiscount">
+		<dl>
+			<div>
+				<dt><span class="mid">할인코드</span></dt>
+				<dd>
+					<div class="form_field">
+						<div class="input_wrap">
+							<input type="text" id="serialCpnNm" class="form_control" maxlength="13" placeholder="할인코드를 입력해주세요.">
+							<button type="button" class="btn btn_dark" onclick="serialCpnApply()">적용</button>
+						</div>
+					</div>
+				</dd>
+			</div>
+			<div id="custCpnInfo" style="display:none">
+				<dt>할인쿠폰</dt>
+				<dd>
+					<a href="javascript:void(0);" class="btn_coupon_toggle">할인쿠폰 <span id="cpnApplyCnt"></span>적용</a>
+					<div class="coupon_list">
+						<ul>
+							<!--  상품쿠폰 -->
+							<th:block th:each="goods, i : ${goodsApplyCpnList}">
+								<th:block th:if="${goods.goodsCpnList.size() > 0}">
+									<li>
+										<div class="coupon">
+											<div class="item_gd">
+												<figure>
+													<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
+													<figcaption>
+														<div class="brand" th:text="${goods.brandEnm}+' '+${goods.brandKnm}"></div>
+														<div class="name" th:text="${goods.goodsNm}"></div>
+														<div class="price">
+															<th:block th:if="${goods.tmtbDcAmt} > 0">
+																<span class="selling_price"  th:text="${#numbers.formatInteger(goods.tmtbDcAmt, 1, 'COMMA')}"></span>
+															</th:block>
+															<th:block th:if="${goods.tmtbDcAmt} < 1">
+																<span class="selling_price"  th:text="${#numbers.formatInteger(goods.currPrice, 1, 'COMMA')}"></span>
+															</th:block>
+														</div>
+													</figcaption>
+												</figure>
+											</div>
+											 
+											<div class="form_field">
+												<div class="select_custom type1">
+													<div class="combo">
+														<input type="hidden" name="cpnType" value="goodsCpn"/>
+														<input type="hidden" name="cpnCartSq" th:value="${goods.cartSq}"/>
+														<input type="hidden" name="custCpnSq" value="0"/>
+														<input type="hidden" name="cpnDcAmt" value="0"/>
+														
+														<div class="select">선택없음</div>
+														<ul class="list">
+															<li value="0">선택없음</li>
+															<th:block th:each="goodsCpn, k : ${goods.goodsCpnList}">
+																<li th:value="${goodsCpn.custCpnSq}" th:data="${goodsCpn.cpnDcAmt}" th:text="${goodsCpn.cpnNm}"></li>
+															</th:block>
+														</ul>
+													</div>
+												</div>
+											</div>
+											<div class="cp_discount" style="display:none;">
+												<span class="cp_amount"></span>
+												<button type="button" class="btn_del_coupon"><span>쿠폰적용해제</span></button>
+											</div>
+										</div>
+									</li>
+								</th:block>
+							</th:block>
+							<!--  상품쿠폰 -->
+
+							<!--  장바구니쿠폰 -->
+							<th:block th:if="${cartCpnList.size() > 0}">
+								<li>
+									<div class="coupon">
+										<div class="form_field">
+											<div class="select_custom type1">
+												<div class="combo">
+													<input type="hidden" name="cpnType" value="cartCpn"/>
+													<input type="hidden" name="custCpnSq" value="0"/>
+													<input type="hidden" name="cpnDcAmt" value="0"/>
+													
+													<div class="select">선택없음</div>
+													<ul class="list">
+														<li value="0">선택없음</li>
+														<th:block th:each="cartCpn, k : ${cartCpnList}">
+															<li th:value="${cartCpn.custCpnSq}" th:data="${cartCpn.cpnDcAmt}">
+																<th:block th:text="${cartCpn.cpnNm}"></th:block>
+																<input type="hidden" name="dcWay" th:value="${cartCpn.dcWay}"/>
+																<input type="hidden" name="dcVal" th:value="${cartCpn.dcVal}"/>
+																<th:block th:each="cartCpnCartSq, kokok : ${cartCpn.cartCpnCartSqArr}"> 
+																	<input type="hidden" name="cartCpnCartSq" th:value="${cartCpnCartSq}" />
+																</th:block>
+															</li>
+														</th:block>
+													</ul>
+												</div>
+											</div>
+										</div>
+										<div class="cp_discount">
+											<span class="cp_amount"></span>
+											<button type="button" class="btn_del_coupon"><span>쿠폰적용해제</span></button>
+										</div>
+									</div>
+								</li>
+							</th:block>
+							<!--  장바구니쿠폰 -->
+							
+							<!--  배송비쿠폰 -->
+							<th:block th:if="${delvCpnList.size() > 0}">
+								<li>
+									<div class="coupon">
+										<div class="form_field">
+											<div class="select_custom type1">
+												<div class="combo">
+													<input type="hidden" name="cpnType" value="delvCpn"/>
+													<input type="hidden" name="custCpnSq" value="0"/>
+													<input type="hidden" name="cpnDcAmt" value="0"/>
+													<input type="hidden" name="delvFeeCd" value="0"/>
+													
+													<div class="select" value="0">선택없음</div>
+													<ul class="list">
+														<li value="0">선택없음</li>
+														<th:block th:each="delvCpn, k : ${delvCpnList}">
+															<li th:value="${delvCpn.custCpnSq}" th:data="${delvCpn.dcVal}" th:delvfeecd="${delvCpn.delvFeeCd}" th:delvfee="${delvCpn.delvFee}" th:text="${delvCpn.cpnNm}"></li>
+														</th:block>
+													</ul>
+												</div>
+											</div>
+										</div>
+										<div class="cp_discount">
+											<span class="cp_amount"></span>
+											<button type="button" class="btn_del_coupon"><span>쿠폰적용해제</span></button>
+										</div>
+									</div>
+								</li>
+							</th:block>
+							<!--  배송비쿠폰 -->
+						</ul>
+					</div>
+				</dd>
+			</div>
+		</dl>
+	</div>
+	
+	<!-- 선포인트금액, 포인트금액, 상품권금액 0보다 클때 적용 -->
+	<th:block th:if="${prePntDcAmt} > 0 or ${rmPntAmt} > 0 or ${rmGfcdAmt} > 0">
+		<div class="area_selpoint">
+			<dl>
+				<th:block th:if="${prePntDcAmt} > 0">
+					<div>
+						<dt>선 포인트 사용</dt>
+						<dd>
+							<div class="form_field">
+								<input type="hidden" name="rmPrePntAmt" th:value="${prePntDcAmt}"/>
+								<div>
+									<input type="radio" name="rdi-beforpoint" id="rdi-beforpoint1" value="N"> 
+									<label for="rdi-beforpoint1"><span>사용 안함</span></label>
+								</div>
+								<div>
+									<input type="radio" name="rdi-beforpoint" id="rdi-beforpoint2" value="Y"> 
+									<label for="rdi-beforpoint2"><span>사용함</span></label> 
+									<span class="remain_point" th:text="|사용가능 포인트 : ${#numbers.formatInteger(prePntDcAmt, 1, 'COMMA')} P|"></span>
+								</div>
+							</div>
+						</dd>
+					</div>
+				</th:block>
+				<th:block th:if="${rmPntAmt} > 0">
+					<div>
+						<dt>
+							<span class="mid">스타일 포인트</span>
+						</dt>
+						<dd>
+							<div class="form_field">
+								<input type="hidden" name="rmPntAmt" th:value="${rmPntAmt}"/>
+								<!-- 스타일 포인트 3만원 이상 결제시 노출 -->
+								<th:block th:if="${orgGoodsSumAmt} >= 30000">
+									<div class="input_wrap">
+										<input type="text" name="pntDcAmtStr" class="form_control" maxlength="" placeholder="사용할 포인트를 입력해주세요.">
+										<button type="button" class="btn btn_dark" id="btn_point_apply">적용</button>
+									</div>
+									<p><span class="remain_point rmPntAmt" th:text="|보유 : ${#numbers.formatInteger(rmPntAmt, 1, 'COMMA')} P|"></span>(결제금액의 최대 40%까지 사용가능)</p>
+								</th:block>
+								<!-- 스타일 포인트 3만원 이상 결제시 노출 -->
+								
+								<!-- 스타일 포인트 3만원 미만 결제시 노출 -->
+								<th:block th:if="${orgGoodsSumAmt} < 30000">
+									<div class="input_wrap">
+										<input type="text" class="form_control" maxlength="" placeholder="3만원 이상 결제시에만 포인트 사용이 가능합니다." disabled>
+									</div>
+								</th:block>
+							</div>
+						</dd>
+					</div>
+				</th:block>
+				<th:block th:if="${rmGfcdAmt} > 0">
+					<div>
+						<dt>
+							<span class="mid">상품권</span>
+						</dt>
+						<dd>
+							<div class="form_field">
+								<input type="hidden" name="rmGfcdAmt" th:value="${rmGfcdAmt}"/>
+								<div class="input_wrap">
+									<input type="text" name="gfcdUseAmtStr" class="form_control" maxlength="" placeholder="사용할 금액을 입력해주세요.">
+									<button type="button" class="btn btn_dark" id="btn_gfcd_apply">적용</button>
+								</div>
+								<p><span class="remain_point" th:text="|보유 : ${#numbers.formatInteger(rmGfcdAmt, 1, 'COMMA')} 원|"></span></p>
+								<div class="agree_receipt">
+									<input id="chk-receipt" type="checkbox"> 
+									<label for="chk-receipt"><span>상품권 현금영수증 신청</span></label>
+									<div class="info_box">
+										<div class="input_wrap">
+											<input type="text" class="form_control" maxlength="11" placeholder="">
+										</div>
+									</div>
+								</div>
+							</div>
+						</dd>
+					</div>
+				</th:block>
+			</dl>
+		</div>
+	</th:block>
+</div> <!-- //할인/혜택 사용 -->
+
+<script th:inline="javascript">
+var dispYn = [[${order.dispYn}]]; // 노출여부
+
+//컨텐츠 호출
+$(document).ready( function() {
+	// 화면펼침
+	if (dispYn == "Y") {
+		$("#dcAmtInfo .fold_head").addClass("on");
+		$("#dcAmtInfo .fold_cont").css("display", "block");
+
+		$("#dcAmtInfo .fold_cont .btn_coupon_toggle").addClass("on");
+		$("#dcAmtInfo .fold_cont .coupon_list").css("display", "block");
+		
+		// 2021.03.15 보유쿠폰존재하면 할인쿠폰 영역 노출
+		var custCpnCnt  = 0;
+		$("#custCpnInfo .coupon").each(function(){
+			custCpnCnt++;
+		});
+		
+		if (custCpnCnt > 0) {
+			$("#custCpnInfo").show();
+		}
+		
+	}
+});
+</script>
+</html>

+ 37 - 35
src/main/webapp/WEB-INF/views/web/order/OrderDeliveryAddrInfoWeb.html

@@ -21,13 +21,12 @@
 			<div class="fold_tit">
 				<span>배송지 정보</span>
 			</div>
-			<div class="data" th:text="${deliveryAddrInfo.recipBaseAddr} + ' ' + ${deliveryAddrInfo.recipDtlAddr}"></div>
+			<div class="data" th:text="${deliveryAddrInfo.recipBaseAddr} + '   ' + ${deliveryAddrInfo.recipDtlAddr}"></div>
 		</div>
 	</a>
 </div>
-
 <div class="fold_cont" style="display: none;">
-	<div class="area_mbinfo">
+	<div class="area_receiveinfo">
 		<input type="hidden" name="recipZipcode" 	th:value="${deliveryAddrInfo.recipZipcode}"/>
 		<input type="hidden" name="recipBaseAddr" 	th:value="${deliveryAddrInfo.recipBaseAddr}"/>
 		<input type="hidden" name="recipDtlAddr" 	th:value="${deliveryAddrInfo.recipDtlAddr}"/>
@@ -37,13 +36,15 @@
 		
 		<dl>
 			<div>
-				<dt><span class="sr-only">배송지명</span></dt>
+				<dt>
+					<span class="sr-only">배송지명</span>
+				</dt>
 				<dd>
-					<span th:text="${deliveryAddrInfo.delvAddrNm}"></span>
-					<span class="icon_tag">
-						<em class="tag_stype1">기본 배송지</em>
+					<th:block th:text="${deliveryAddrInfo.delvAddrNm}"></th:block>
+					<span class="icon_tag"> 
+						<em class="tag gray">기본 배송지</em> 
 						<th:block th:if="${order.shotDelvUseYn} == 'Y'"> 
-							<em class="tag_stype2">총알배송</em>
+							<em class="tag primary_line">총알배송</em>
 						</th:block>
 					</span>
 				</dd>
@@ -53,9 +54,9 @@
 					<span class="sr-only">배송주소</span>
 				</dt>
 				<dd>
-					<span th:text="${deliveryAddrInfo.recipBaseAddr} + ${deliveryAddrInfo.recipDtlAddr}"></span>
-					<button type="button" class="btn_popup" id="btn_adrsChange_pop">
-						<span>배송지 선택</span>
+					<th:block th:text="${deliveryAddrInfo.recipBaseAddr} + '    ' + ${deliveryAddrInfo.recipDtlAddr}"></th:block>
+					<button type="button" class="btn btn_default btn_sm" id="btn_adrsChange_pop">
+						<span>배송지 변경</span>
 					</button>
 				</dd>
 			</div>
@@ -68,53 +69,53 @@
 			<div>
 				<dt>배송요청 사항</dt>
 				<dd>
-					<span th:text="${deliveryAddrInfo.delvMemo}" id="delvMemo"></span>
-					<button type="button" class="btn_popup" id="btn_rqstModify_pop">
+					<th:block th:text="${deliveryAddrInfo.delvMemo}" id="delvMemo"></th:block>
+					<button type="button" class="btn_underline" id="btn_rqstModify_pop">
 						<span>변경하기</span>
 					</button>
 				</dd>
 			</div>
 		</dl>
 	</div>
-	<!-- /배송지정보 -->
 	
 	<!-- 해외배송상품일 경우 노출 -->
 	<th:block th:if="${order.foreignBuyYn} == 'Y'">
 		<div class="area_overseas">
 			<dl>
 				<div>
-					<input type="hidden" name="entryNo" value=""/>
-					
 					<dt>개인통관고유부호</dt>
 					<dd>
 						<div class="form_field">
 							<div>
-								<input type="radio" name="rdi-overseas" id="rdi-overs1" checked> 
-								<label for="rdi-overs1"><span>받는사람 개인통관고유부호</span></label>
+								<input type="radio" name="rdi-overseas"
+									id="rdi-overs1" value="" checked=""> <label
+									for="rdi-overs1"><span>받는사람 개인통관고유부호</span></label>
 							</div>
 							<div>
-								<input type="radio" name="rdi-overseas" id="rdi-overs2">
-								<label for="rdi-overs2"><span>입력 안 함</span></label>
+								<input type="radio" name="rdi-overseas"
+									id="rdi-overs2" value=""> <label
+									for="rdi-overs2"><span>입력 안 함</span></label>
 							</div>
 							<div class="info_box overs1">
 								<div class="input_wrap">
-									<input type="text" name="entryNo" class="form_control err" maxlength="13" placeholder="P로 시작하는 13자리" value="abcde12345qwe">
+									<input type="text" class="form_control err"
+										maxlength="13" placeholder="P로 시작하는 13자리">
 									<!-- 유효하지 않은 개인통관고유부호 일때 class명 'err' 추가 -->
 								</div>
 								<div class="t_err">개인통관고유부호가 유효하지 않습니다.</div>
 								<!-- 유효하지 않은 개인통관고유부호 일때 노출 -->
 								<div class="agree_overs">
 									<input id="chk-overs-agr" type="checkbox" checked="">
-									<label for="chk-overs-agr">
-										<span>
-											위 정보는 원활한 통관을 위해 수집 및 판매자에게 제공하며,계속 사용하도록 안전하게 STYLE24에서 저장 &#47; 관리 합니다.&nbsp;&nbsp;
-											<em class="tmark_required">(필수)</em>
-										</span>
-									</label>
+									<label for="chk-overs-agr"><span>위
+											정보는 원활한 통관을 위해 수집 및 판매자에게 제공하며,계속 사용하도록 안전하게
+											STYLE24에서 저장 / 관리 합니다.&nbsp;&nbsp;<em
+											class="tmark_required">(필수)</em>
+									</span></label>
 								</div>
 							</div>
 							<div class="info_box overs2" style="display: none;">
-								<p>개인통관고유부호를 입력하지 않아도 관세사무소에서 개인정보 확인을 위해 별도 연락을 드릴 예정입니다.</p>
+								<p>개인통관고유부호를 입력하지 않아도 관세사무소에서 개인정보 확인을 위해 별도 연락을
+									드릴 예정입니다.</p>
 							</div>
 						</div>
 						<div class="info_txt">
@@ -136,23 +137,24 @@
 			<div class="form_field">
 				<div class="agree_custom">
 					<input id="chk-custom-agr1" type="checkbox" checked="">
-					<label for="chk-custom-agr1">
-						<span>고객님께서 주문하신 상품에는 주문제작상품이 포함되어 있습니다.<br>주문제작상품에 대한 안내를 확인하였으며 배송에 동의합니다.&nbsp;&nbsp;
-							<em class="tmark_required">(필수)</em>
-						</span>
-					</label>
+					<label for="chk-custom-agr1"><span>고객님께서
+							주문하신 상품에는 주문제작상품이 포함되어 있습니다.<br>주문제작상품에 대한 안내를
+							확인하였으며 배송에 동의합니다.&nbsp;&nbsp;<em
+							class="tmark_required">(필수)</em>
+					</span></label>
 				</div>
 			</div>
 			<div class="info_txt">
 				<ul>
 					<li>주문 제작 상품은 주문 후 제작이 진행되며, 제작 완료 후 배송이 시작됩니다.</li>
-					<li>주문 제작 상품의 특성상 주문 완료 후 취소/교환이 불가능합니다. (상품 하자에 한해 가능)</li>
+					<li>주문 제작 상품의 특성상 주문 완료 후 취소/교환이 불가능합니다. (상품 하자에 한해
+						가능)</li>
 				</ul>
 			</div>
 		</div>
 	</th:block>
 	<!-- //주문제작상품일 경우 노출 -->
-</div>
+</div> <!-- //배송지정보 -->
 
 <script th:inline="javascript">
 var dispYn = [[${order.dispYn}]]; // 노출여부

+ 21 - 530
src/main/webapp/WEB-INF/views/web/order/OrderFormWeb.html

@@ -271,531 +271,24 @@
 									<li class="fold_mbinfo" id="custemerInfo" style="display:none"></li>
 									<!-- //주문고객정보 -->
 									
-									<!-- 주문고객정보 
-									<li class="fold_mbinfo" id="custemerInfo" style="display:none"></li>-->
-									<!-- 주문고객정보 -->
+									<!-- 배송지정보 -->
+									<li class="fold_mbinfo" id="deliveryAddrInfo" style="display:none"></li>
+									<!-- //배송지정보 -->
 									
-									<li class="fold_mbinfo">
-										<!-- 배송지정보 -->
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit">
-														<span>배송지 정보</span>
-													</div>
-													<div class="data">서울시 영등포구 은행로 11,8층(여의도동,일신빌딩)</div>
-												</div>
-											</a>
-										</div>
-										<div class="fold_cont" style="display: none;">
-											<div class="area_receiveinfo">
-												<dl>
-													<div>
-														<dt>
-															<span class="sr-only">배송지명</span>
-														</dt>
-														<dd>
-															홍길동 <span class="icon_tag"> <em class="tag gray">기본
-																	배송지</em> <em class="tag primary_line">총알배송</em>
-															</span>
-														</dd>
-													</div>
-													<div>
-														<dt>
-															<span class="sr-only">배송주소</span>
-														</dt>
-														<dd>
-															서울시 영등포구 은행로 11,8층(여의도동,일신빌딩)
-															<button type="button" class="btn btn_default btn_sm"
-																id="btn_adrsChange_pop">
-																<span>배송지 변경</span>
-															</button>
-														</dd>
-													</div>
-													<div>
-														<dt>
-															<span class="sr-only">휴대폰 번호</span>
-														</dt>
-														<dd>010-1234-5647</dd>
-													</div>
-													<div>
-														<dt>배송요청 사항</dt>
-														<dd>
-															직접받고 부재 시 문앞
-															<button type="button" class="btn_underline"
-																id="btn_rqstModify_pop">
-																<span>변경하기</span>
-															</button>
-														</dd>
-													</div>
-												</dl>
-											</div>
-											<!-- 해외배송상품일 경우 노출 -->
-											<div class="area_overseas">
-												<dl>
-													<div>
-														<dt>개인통관고유부호</dt>
-														<dd>
-															<div class="form_field">
-																<div>
-																	<input type="radio" name="rdi-overseas"
-																		id="rdi-overs1" value="" checked=""> <label
-																		for="rdi-overs1"><span>받는사람 개인통관고유부호</span></label>
-																</div>
-																<div>
-																	<input type="radio" name="rdi-overseas"
-																		id="rdi-overs2" value=""> <label
-																		for="rdi-overs2"><span>입력 안 함</span></label>
-																</div>
-																<div class="info_box overs1">
-																	<div class="input_wrap">
-																		<input type="text" class="form_control err"
-																			maxlength="13" placeholder="P로 시작하는 13자리">
-																		<!-- 유효하지 않은 개인통관고유부호 일때 class명 'err' 추가 -->
-																	</div>
-																	<div class="t_err">개인통관고유부호가 유효하지 않습니다.</div>
-																	<!-- 유효하지 않은 개인통관고유부호 일때 노출 -->
-																	<div class="agree_overs">
-																		<input id="chk-overs-agr" type="checkbox" checked="">
-																		<label for="chk-overs-agr"><span>위
-																				정보는 원활한 통관을 위해 수집 및 판매자에게 제공하며,계속 사용하도록 안전하게
-																				STYLE24에서 저장 / 관리 합니다.&nbsp;&nbsp;<em
-																				class="tmark_required">(필수)</em>
-																		</span></label>
-																	</div>
-																</div>
-																<div class="info_box overs2" style="display: none;">
-																	<p>개인통관고유부호를 입력하지 않아도 관세사무소에서 개인정보 확인을 위해 별도 연락을
-																		드릴 예정입니다.</p>
-																</div>
-															</div>
-															<div class="info_txt">
-																<ul>
-																	<li>물품가액이 $150초과할 경우 관/부과세가 발생 할 수 있습니다.</li>
-																	<li>물품 종류와 해외공급자 관계없이 같은 날 입항하게 되면 합산과세 대상이 됩니다.</li>
-																</ul>
-															</div>
-														</dd>
-													</div>
-												</dl>
-											</div>
-											<!-- //해외배송상품일 경우 노출 -->
-											<!-- 주문제작상품일 경우 노출 -->
-											<div class="area_customitem">
-												<div class="form_field">
-													<div class="agree_custom">
-														<input id="chk-custom-agr1" type="checkbox" checked="">
-														<label for="chk-custom-agr1"><span>고객님께서
-																주문하신 상품에는 주문제작상품이 포함되어 있습니다.<br>주문제작상품에 대한 안내를
-																확인하였으며 배송에 동의합니다.&nbsp;&nbsp;<em
-																class="tmark_required">(필수)</em>
-														</span></label>
-													</div>
-												</div>
-												<div class="info_txt">
-													<ul>
-														<li>주문 제작 상품은 주문 후 제작이 진행되며, 제작 완료 후 배송이 시작됩니다.</li>
-														<li>주문 제작 상품의 특성상 주문 완료 후 취소/교환이 불가능합니다. (상품 하자에 한해
-															가능)</li>
-													</ul>
-												</div>
-											</div>
-											<!-- //주문제작상품일 경우 노출 -->
-										</div> <!-- //배송지정보 -->
-									</li>
-									<li>
-										<!-- 사은품선택 -->
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit">
-														<span>사은품 선택</span>
-													</div>
-													<div class="data">
-														<span>사은품 총 <em class="total_gift">2</em>개 선택
-														</span> <span><em class="total_deduct">0</em>P 차감</span>
-													</div>
-												</div>
-											</a>
-										</div>
-										<div class="fold_cont" style="display: none;">
-											<div class="area_selgift">
-												<div class="gift_box">
-													<p class="txt">
-														<span>사은품선택1</span> TBJ 남성 제기장 스웨이드 트러커 자켓 에서 주는 사은품
-													</p>
-													<div class="form_field">
-														<div class="gift">
-															<input type="radio" name="rdi-gift1" id="rdi-gift1"
-																class="chk_img" value=""> <label
-																for="rdi-gift1"> <span class="thumb"><img
-																	src="/images/pc/thumb/tmp_gift1.jpg" width="" alt=""></span>
-																<span class="name">유니 NBA 팀로고 양말 (N215AO225P)</span> <span
-																class="deduct">무료</span>
-															</label>
-														</div>
-														<div class="gift">
-															<input type="radio" name="rdi-gift1" id="rdi-gift2"
-																class="chk_img" value=""> <label
-																for="rdi-gift2"> <span class="thumb"><img
-																	src="/images/pc/thumb/tmp_gift1.jpg" width="" alt=""></span>
-																<span class="name">사은품이름</span> <span class="deduct">-4,000P</span>
-															</label>
-														</div>
-														<div class="gift">
-															<input type="radio" name="rdi-gift1" id="rdi-gift3"
-																class="chk_img" value=""> <label
-																for="rdi-gift3"> <span class="thumb"><img
-																	src="/images/pc/thumb/tmp_gift1.jpg" width="" alt=""></span>
-																<span class="name">사은품이름</span> <span class="deduct">-4,000P</span>
-															</label>
-														</div>
-														<div class="gift">
-															<input type="radio" name="rdi-gift1" id="rdi-gift4"
-																class="chk_img" value=""> <label
-																for="rdi-gift4"> <span class="thumb"><img
-																	src="/images/pc/thumb/tmp_gift_empty.jpg" width=""
-																	alt=""></span> <span class="name">사은품 수령안함</span> <span
-																class="deduct">수령거부</span>
-															</label>
-														</div>
-													</div>
-												</div>
-												<div class="gift_box">
-													<p class="txt">
-														<span>사은품선택2</span> 10만원 이상 구매시 사은품
-													</p>
-													<div class="form_field">
-														<div class="gift">
-															<input type="radio" name="rdi-gift2" id="rdi-gift11"
-																class="chk_img" value=""> <label
-																for="rdi-gift11"> <span class="thumb"><img
-																	src="/images/pc/thumb/tmp_gift1.jpg" width="" alt=""></span>
-																<span class="name">유니 NBA 팀로고 양말 (N215AO225P)</span> <span
-																class="deduct">무료</span>
-															</label>
-														</div>
-														<div class="gift">
-															<input type="radio" name="rdi-gift2" id="rdi-gift12"
-																class="chk_img" value=""> <label
-																for="rdi-gift12"> <span class="thumb"><img
-																	src="/images/pc/thumb/tmp_gift1.jpg" width="" alt=""></span>
-																<span class="name">사은품이름</span> <span class="deduct">-4,000P</span>
-															</label>
-														</div>
-														<div class="gift">
-															<input type="radio" name="rdi-gift2" id="rdi-gift13"
-																class="chk_img" value=""> <label
-																for="rdi-gift13"> <span class="thumb"><img
-																	src="/images/pc/thumb/tmp_gift_empty.jpg" width=""
-																	alt=""></span> <span class="name">사은품 수령안함</span> <span
-																class="deduct">수령거부</span>
-															</label>
-														</div>
-													</div>
-												</div>
-												<div class="form_field">
-													<div class="agree_gift">
-														<p>
-															<input id="chk-agree_gift" type="checkbox"><label
-																for="chk-agree_gift"><span>동의합니다</span></label>
-														</p>
-														<p class="txt">
-															사은품 지금에 대한 내용을 확인하였으며, 이에 동의합니다.
-															<button type="button" class="btn_underline"
-																id="btn_infoGift_pop">
-																<span>보기</span>
-															</button>
-														</p>
-													</div>
-												</div>
-											</div>
-										</div> <!-- //사은품선택 -->
-									</li>
-									<li>
-										<!-- 할인/혜택 사용 -->
-										<div class="fold_head on">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit">
-														<span>할인/혜택 사용</span>
-													</div>
-													<div class="data maxdisc">
-														<div class="form_field">
-															<input id="chk-maxdisc" type="checkbox" checked="">
-															<label for="chk-maxdisc"><span>최대 할인혜택을
-																	바로 적용하세요!</span>&nbsp;<span class="maxdisc_amount">(<em>-3,000</em>원
-																	할인)
-															</span></label>
-														</div>
-													</div>
-												</div>
-											</a>
-										</div>
-										<div class="fold_cont" style="display: block;">
-											<div class="area_seldiscount">
-												<dl>
-													<div>
-														<dt>할인쿠폰</dt>
-														<dd>
-															<div class="sale_coupon_box">
-																<div>
-																	<span class="maxdisc_amount">총&nbsp;<em>-3,000</em>원
-																		할인
-																	</span>
-																	<button id="btn_couponModify_pop"
-																		class="btn btn_default btn_sm">
-																		<span>쿠폰변경</span>
-																	</button>
-																</div>
-																<div class="form_field">
-																	<div class="input_wrap">
-																		<input type="text" class="form_control"
-																			maxlength="13" placeholder="할인코드를 입력해주세요.">
-																		<button type="button" class="btn btn_dark btn_sm">
-																			<span>적용</span>
-																		</button>
-																	</div>
-																</div>
-															</div>
-														</dd>
-													</div>
-													<div>
-														<dt>배송비 쿠폰</dt>
-														<dd>
-															<div class="dlvr_fee_box">
-
-																<div class="form_field">
-																	<div class="select_custom coupon_list">
-																		<div class="combo">
-																			<div class="select">
-																				<div class="dlvr_coupon">
-																					<p class="empty">선택</p>
-																				</div>
-																			</div>
-																			<ul class="list" style="display: none;">
-																				<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true"추가  -->
-																				<li class="selected">
-																					<div class="dlvr_coupon">
-																						<p class="name">TBJ 배송비 무료쿠폰</p>
-																						<p class="txt">
-																							<span>30,000</span>원 이상 구매시 최대 <span>3,000</span>원
-																							할인
-																						</p>
-																						<p class="discount">
-																							<span>15,000</span>원 할인
-																						</p>
-																					</div>
-																				</li>
-																				<li>
-																					<div class="dlvr_coupon">
-																						<p class="name">TBJ 배송비 무료쿠폰</p>
-																						<p class="txt">
-																							<span>30,000</span>원 이상 구매시 최대 <span>3,000</span>원
-																							할인
-																						</p>
-																						<p class="discount">
-																							<span>15,000</span>원 할인
-																						</p>
-																					</div>
-																				</li>
-																				<li>
-																					<div class="dlvr_coupon">
-																						<p class="name">TBJ 배송비 무료쿠폰</p>
-																						<p class="txt">
-																							<span>30,000</span>원 이상 구매시 최대 <span>3,000</span>원
-																							할인
-																						</p>
-																						<p class="discount">
-																							<span>15,000</span>원 할인
-																						</p>
-																					</div>
-																				</li>
-																				<li aria-disabled="true">
-																					<div class="dlvr_coupon">
-																						<p class="name">TBJ 배송비 무료쿠폰</p>
-																						<p class="txt">
-																							<span>30,000</span>원 이상 구매시 최대 <span>3,000</span>원
-																							할인
-																						</p>
-																						<p class="discount">
-																							<span>15,000</span>원 할인
-																						</p>
-																					</div>
-																				</li>
-																				<li>
-																					<div class="dlvr_coupon">
-																						<p class="empty">적용 안함</p>
-																					</div>
-																				</li>
-																			</ul>
-																		</div>
-																	</div>
-																</div>
-
-															</div>
-														</dd>
-													</div>
-												</dl>
-											</div>
-											<div class="area_selpoint">
-												<dl>
-													<div>
-														<dt>선 포인트 사용</dt>
-														<dd>
-															<div class="form_field">
-																<div>
-																	<input type="radio" name="rdi-beforpoint"
-																		id="rdi-beforpoint1" value="" checked=""> <label
-																		for="rdi-beforpoint1"><span>사용 안함</span></label>
-																</div>
-																<div>
-																	<input type="radio" name="rdi-beforpoint"
-																		id="rdi-beforpoint2" value=""> <label
-																		for="rdi-beforpoint2"><span>사용함</span></label> <span
-																		class="useable_point">(<em>1,500P</em>&nbsp;사용
-																		가능)
-																	</span>
-																</div>
-															</div>
-														</dd>
-													</div>
-													<div>
-														<dt>스타일 포인트</dt>
-														<dd>
-															<div class="form_field">
-																<!-- 스타일 포인트 3만원 이상 결제시 노출 -->
-																<div class="input_wrap">
-																	<input type="text" class="form_control" maxlength=""
-																		placeholder="사용할 포인트를 입력해주세요.">
-																	<button type="button" class="btn btn_dark btn_sm">
-																		<span>적용</span>
-																	</button>
-																</div>
-																<!-- 스타일 포인트 3만원 이상 결제시 노출 -->
-																<!-- 스타일 포인트 3만원 미만 결제시 노출 -->
-																<div class="input_wrap">
-																	<input type="text" class="form_control" maxlength=""
-																		placeholder="3만원 이상 결제시에만 포인트 사용이 가능합니다."
-																		disabled="">
-																	<button type="button" class="btn btn_dark btn_sm">
-																		<span>적용</span>
-																	</button>
-																</div>
-																<!-- //스타일 포인트 3만원 미만 결제시 노출 -->
-																<p>
-																	<span class="remain_point">보유:&nbsp;<em>25,500</em>P
-																	</span>(결제금액의 최대 40%까지 사용가능)
-																</p>
-															</div>
-														</dd>
-													</div>
-													<div>
-														<dt>상품권</dt>
-														<dd>
-															<div class="form_field">
-																<div class="input_wrap">
-																	<input type="text" class="form_control" maxlength=""
-																		placeholder="사용할 금액을 입력해주세요.">
-																	<button type="button" class="btn btn_dark btn_sm">
-																		<span>적용</span>
-																	</button>
-																</div>
-																<p>
-																	<span class="remain_point">보유:&nbsp;<em>25,500</em>원
-																	</span>
-																</p>
-																<div class="agree_receipt">
-																	<input id="chk-receipt" type="checkbox"> <label
-																		for="chk-receipt"><span>상품권 현금영수증 신청</span></label>
-																	<div class="info_box">
-																		<div class="input_wrap">
-																			<input type="text" class="form_control"
-																				maxlength="11" placeholder="">
-																		</div>
-																	</div>
-																</div>
-															</div>
-														</dd>
-													</div>
-												</dl>
-											</div>
-										</div> <!-- //할인/혜택 사용 -->
-									</li>
-									<li class="fold_paymethod">
-										<!-- 결제수단 선택 -->
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit">
-														<span>결제수단 선택</span>
-													</div>
-													<div class="data">
-														<span>신용카드</span>
-													</div>
-												</div>
-											</a>
-										</div>
-										<div class="fold_cont" style="display: none;">
-											<div class="area_paymethod">
-												<div class="form_field">
-													<div class="paymethod_box">
-														<ul class="sel_method">
-															<li><input type="radio" name="rdi-paynormal"
-																id="payCreditCard" value="" checked="checked">
-																<label for="payCreditCard"><span>신용카드</span></label></li>
-															<li><input type="radio" name="rdi-paynormal"
-																id="payCellphone" value=""> <label
-																for="payCellphone"><span>휴대폰 결제</span></label></li>
-															<li><input type="radio" name="rdi-paynormal"
-																id="payKakao" value=""> <label for="payKakao"><span><em
-																		class="sr-only">카카오페이 결제</em><em
-																		class="payimg kakao"></em></span></label></li>
-															<li><input type="radio" name="rdi-paynormal"
-																id="payNaver" value=""> <label for="payNaver"><span><em
-																		class="sr-only">네이버페이 결제</em><em
-																		class="payimg naver"></em></span></label></li>
-															<li><input type="radio" name="rdi-paynormal"
-																id="payPayco" value=""> <label for="payPayco"><span><em
-																		class="sr-only">페이코 결제</em><em class="payimg payco"></em></span></label>
-															</li>
-															<li><input type="radio" name="rdi-paynormal"
-																id="payRealBank" value=""> <label
-																for="payRealBank"><span>실시간계좌이체</span></label></li>
-															<li><input type="radio" name="rdi-paynormal"
-																id="payVirtualBank" value=""> <label
-																for="payVirtualBank"><span>무통장입금</span></label></li>
-														</ul>
-													</div>
-												</div>
-												<div class="form_field">
-													<div class="agree_paymethod">
-														<input id="chk-agree_paymethod" type="checkbox">
-														<label for="chk-agree_paymethod"> <span>선택한
-																결제수단으로 향후 결제 이용에 동의합니다.&nbsp;&nbsp;<em
-																class="tmark_optional">(선택)</em>
-														</span>
-														</label>
-													</div>
-												</div>
-												<div class="form_field">
-													<div class="agree_insurance">
-														<input id="chk-insurance" type="checkbox"> <label
-															for="chk-insurance"> <span>소비자 피해 보상보험
-																신청&nbsp;&nbsp;<em class="tmark_optional">(선택)</em>
-														</span> <a href="" class="btn_underline"><span>FAQ확인</span></a>
-														</label>
-														<p>
-															‘전자상거래 등에서의 소비자보호에 관한 법률‘에 따라 현금 결제 시 서울보증보험㈜가 제공하는 소비자
-															피해보상보험을<br>신청할 수 있도록 해드리고 있습니다. (2013.11.28부터 시행)
-														</p>
-													</div>
-												</div>
-											</div>
-										</div> <!-- //결제수단 선택 -->
-									</li>
+									<!-- //사은품정보 -->
+									<li id="freegiftInfo" style="display:none"></li>
+									<!-- //사은품정보 -->
+									
+									<!-- 할인/혜택 사용 -->
+									<li id="dcAmtInfo" style="display:none"></li>
+									<!-- //할인/혜택 사용 -->
+									
+									<!-- 결제수단 선택 -->
+									<li class="fold_paymethod" id="paymentInfo" style="display:none"></li>
+									<!-- //결제수단 선택 -->
 								</ul>
 							</div>
+							
 							<div class="area_paymentinfo">
 								<div class="paymentinfo">
 									<div class="payinfo_blk">
@@ -833,23 +326,21 @@
 											내용입니다.결제대행서비스 약관 동의 내용입니다.</div>
 									</div>
 								</div>
-
-								<div class="agree_payment">위 주문내역을 확인 하였으며, 회원 본인은 결제에
-									동의합니다.</div>
+								<div class="agree_payment">위 주문내역을 확인 하였으며, 회원 본인은 결제에 동의합니다.</div>
 							</div>
+							
 							<div class="area_paybtn">
 								<div class="form_field">
 									<button type="button" class="btn btn_primary btn_block">
-										<span>동의 후 <em>123,456,789원</em> 결제하기
-										</span>
+										<span>동의 후 <em>123,456,789원</em> 결제하기</span>
 									</button>
 								</div>
 							</div>
 						</div>
 					</form>
-
-
 				</div>
+				
+				
 				<div class="od_side">
 					<div class="area_order">
 						<div class="tit_box">
@@ -1215,7 +706,7 @@ var custemerInfoSet = function(jsonData) {
 				$(".cellPhnno").text($("input[name='cellPhnno']").val());
 			}
 			// 1.2 배송정보로드
-			//deliveryAddrInfoSet(jsonData);
+			deliveryAddrInfoSet(jsonData);
 		}
 	});
 }

+ 1 - 126
src/main/webapp/WEB-INF/views/web/order/OrderFormWeb_20210318.html

@@ -307,132 +307,7 @@
 										</div> <!-- //주문고객정보 -->
 									</li>
 									<li class="fold_mbinfo">
-										<!-- 배송지정보 -->
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit">
-														<span>배송지 정보</span>
-													</div>
-													<div class="data">서울시 영등포구 은행로 11,8층(여의도동,일신빌딩)</div>
-												</div>
-											</a>
-										</div>
-										<div class="fold_cont" style="display: none;">
-											<div class="area_receiveinfo">
-												<dl>
-													<div>
-														<dt>
-															<span class="sr-only">배송지명</span>
-														</dt>
-														<dd>
-															홍길동 <span class="icon_tag"> <em class="tag gray">기본
-																	배송지</em> <em class="tag primary_line">총알배송</em>
-															</span>
-														</dd>
-													</div>
-													<div>
-														<dt>
-															<span class="sr-only">배송주소</span>
-														</dt>
-														<dd>
-															서울시 영등포구 은행로 11,8층(여의도동,일신빌딩)
-															<button type="button" class="btn btn_default btn_sm"
-																id="btn_adrsChange_pop">
-																<span>배송지 변경</span>
-															</button>
-														</dd>
-													</div>
-													<div>
-														<dt>
-															<span class="sr-only">휴대폰 번호</span>
-														</dt>
-														<dd>010-1234-5647</dd>
-													</div>
-													<div>
-														<dt>배송요청 사항</dt>
-														<dd>
-															직접받고 부재 시 문앞
-															<button type="button" class="btn_underline"
-																id="btn_rqstModify_pop">
-																<span>변경하기</span>
-															</button>
-														</dd>
-													</div>
-												</dl>
-											</div>
-											<!-- 해외배송상품일 경우 노출 -->
-											<div class="area_overseas">
-												<dl>
-													<div>
-														<dt>개인통관고유부호</dt>
-														<dd>
-															<div class="form_field">
-																<div>
-																	<input type="radio" name="rdi-overseas"
-																		id="rdi-overs1" value="" checked=""> <label
-																		for="rdi-overs1"><span>받는사람 개인통관고유부호</span></label>
-																</div>
-																<div>
-																	<input type="radio" name="rdi-overseas"
-																		id="rdi-overs2" value=""> <label
-																		for="rdi-overs2"><span>입력 안 함</span></label>
-																</div>
-																<div class="info_box overs1">
-																	<div class="input_wrap">
-																		<input type="text" class="form_control err"
-																			maxlength="13" placeholder="P로 시작하는 13자리">
-																		<!-- 유효하지 않은 개인통관고유부호 일때 class명 'err' 추가 -->
-																	</div>
-																	<div class="t_err">개인통관고유부호가 유효하지 않습니다.</div>
-																	<!-- 유효하지 않은 개인통관고유부호 일때 노출 -->
-																	<div class="agree_overs">
-																		<input id="chk-overs-agr" type="checkbox" checked="">
-																		<label for="chk-overs-agr"><span>위
-																				정보는 원활한 통관을 위해 수집 및 판매자에게 제공하며,계속 사용하도록 안전하게
-																				STYLE24에서 저장 / 관리 합니다.&nbsp;&nbsp;<em
-																				class="tmark_required">(필수)</em>
-																		</span></label>
-																	</div>
-																</div>
-																<div class="info_box overs2" style="display: none;">
-																	<p>개인통관고유부호를 입력하지 않아도 관세사무소에서 개인정보 확인을 위해 별도 연락을
-																		드릴 예정입니다.</p>
-																</div>
-															</div>
-															<div class="info_txt">
-																<ul>
-																	<li>물품가액이 $150초과할 경우 관/부과세가 발생 할 수 있습니다.</li>
-																	<li>물품 종류와 해외공급자 관계없이 같은 날 입항하게 되면 합산과세 대상이 됩니다.</li>
-																</ul>
-															</div>
-														</dd>
-													</div>
-												</dl>
-											</div>
-											<!-- //해외배송상품일 경우 노출 -->
-											<!-- 주문제작상품일 경우 노출 -->
-											<div class="area_customitem">
-												<div class="form_field">
-													<div class="agree_custom">
-														<input id="chk-custom-agr1" type="checkbox" checked="">
-														<label for="chk-custom-agr1"><span>고객님께서
-																주문하신 상품에는 주문제작상품이 포함되어 있습니다.<br>주문제작상품에 대한 안내를
-																확인하였으며 배송에 동의합니다.&nbsp;&nbsp;<em
-																class="tmark_required">(필수)</em>
-														</span></label>
-													</div>
-												</div>
-												<div class="info_txt">
-													<ul>
-														<li>주문 제작 상품은 주문 후 제작이 진행되며, 제작 완료 후 배송이 시작됩니다.</li>
-														<li>주문 제작 상품의 특성상 주문 완료 후 취소/교환이 불가능합니다. (상품 하자에 한해
-															가능)</li>
-													</ul>
-												</div>
-											</div>
-											<!-- //주문제작상품일 경우 노출 -->
-										</div> <!-- //배송지정보 -->
+										
 									</li>
 									<li>
 										<!-- 사은품선택 -->

+ 55 - 55
src/main/webapp/WEB-INF/views/web/order/OrderFreegiftInfoWeb.html

@@ -15,7 +15,7 @@
  -->
 
 <th:block th:if="${freegiftList != null && #lists.size(freegiftList) > 0}">
-
+<!-- 사은품선택 -->
 <div class="fold_head">
 	<a href="javascript:void(0)">
 		<div>
@@ -23,83 +23,83 @@
 				<span>사은품 선택</span>
 			</div>
 			<div class="data">
-				<span>사은품 총 <em class="total_gift">0</em>&nbsp;개 선택</span> 
-				<span><em class="total_deduct">0</em>&nbsp;P 차감</span>
+				<span>사은품 총 <em class="total_gift">0</em>개 선택</span> 
+				<span><em class="total_deduct">0</em>P 차감</span>
 			</div>
 		</div>
 	</a>
 </div>
 <div class="fold_cont" style="display: none;">
 	<div class="area_selgift">
-		<th:block th:each="freegift, i : ${freegiftList}">
-			<div class="gift_box">
-				<p class="txt">
-					<th:block th:if="${freegift.allYn} == 'Y'">
-						<span th:text="'사은품필수' + ${i.count} + ' ' + ${freegift.freegiftNm}"></span>
-					</th:block>
-					<th:block th:if="${freegift.allYn} == 'N'">
-						<span th:text="'사은품선택' + ${i.count} + ' ' + ${freegift.freegiftNm}"></span>
-					</th:block>
-				</p>
-				<div class="form_field">
-					<!-- 전체지급 사음품(필수) -->
-					<th:block th:if="${freegift.allYn} == 'Y'">
-						<th:block th:each="freegiftGoods, k : ${freegiftGoodsList}">
-							<th:block th:if="${freegift.freegiftSq} == ${freegiftGoods.freegiftSq}">
-								<div class="gift">
-									<input type="hidden" th:name="'rdi-gift'+${i.count}" th:id="'rdi-gift'+${i.count}+${k.count}" class="chk_img freegiftRdo" th:value="${freegiftGoods.freegiftValSq}" usepoint="0" allYn="Y">
-									<label th:for="'rdi-gift'+${i.count}+${k.count}"> 
-										<span class="thumb"><img src="http://ts5000.ipdisk.co.kr:89/images/pc/thumb/tmp_gift1.jpg" width="" alt=""></span>
-										<span class="name" th:text="${freegiftGoods.goodsNm}"></span> 
-										<span class="deduct">무료</span>
-									</label>
-								</div>
-							</th:block>
+		<div class="gift_box">
+			<p class="txt">
+				<th:block th:if="${freegift.allYn} == 'Y'">
+					<span th:text="'사은품필수' + ${i.count} + ' ' + ${freegift.freegiftNm}"></span>
+				</th:block>
+				<th:block th:if="${freegift.allYn} == 'N'">
+					<span th:text="'사은품선택' + ${i.count} + ' ' + ${freegift.freegiftNm}"></span>
+				</th:block>
+			</p>
+			<div class="form_field">
+				<!-- 전체지급 사음품(필수) -->
+				<th:block th:if="${freegift.allYn} == 'Y'">
+					<th:block th:each="freegiftGoods, k : ${freegiftGoodsList}">
+						<th:block th:if="${freegift.freegiftSq} == ${freegiftGoods.freegiftSq}">
+							<div class="gift">
+								<input type="hidden" th:name="'rdi-gift'+${i.count}" th:id="'rdi-gift'+${i.count}+${k.count}" class="chk_img freegiftRdo" th:value="${freegiftGoods.freegiftValSq}" usepoint="0" allYn="Y">
+								<label th:for="'rdi-gift'+${i.count}+${k.count}"> 
+									<span class="thumb"><img src="http://ts5000.ipdisk.co.kr:89/images/pc/thumb/tmp_gift1.jpg" width="" alt=""></span>
+									<span class="name" th:text="${freegiftGoods.goodsNm}"></span> 
+									<span class="deduct">무료</span>
+								</label>
+							</div>
 						</th:block>
 					</th:block>
-					<!-- 선택지급 사음품(선택) -->
-					<th:block th:if="${freegift.allYn} == 'N'">
-						<th:block th:each="freegiftGoods, k : ${freegiftGoodsList}">
-							<th:block th:if="${freegift.freegiftSq} == ${freegiftGoods.freegiftSq}">
-								<div class="gift">
-									<input type="radio" th:name="'rdi-gift'+${i.count}" th:id="'rdi-gift'+${i.count}+${k.count}" class="chk_img freegiftRdo" th:value="${freegiftGoods.freegiftValSq}" th:usepoint="${freegiftGoods.usePoint}"  allYn="N"> 
-									<label th:for="'rdi-gift'+${i.count}+${k.count}"> 
-										<span class="thumb"><img src="http://ts5000.ipdisk.co.kr:89/images/pc/thumb/tmp_gift1.jpg" width="" alt=""></span>
-										<span class="name" th:text="${freegiftGoods.goodsNm}"></span> 
-										<span th:if="${freegiftGoods.usePoint} < 1" class="deduct" th:text="무료"></span>
-										<span th:if="${freegiftGoods.usePoint} > 0" class="deduct" th:text="|- ${freegiftGoods.usePoint} P|"></span>
-									</label>
-								</div>
-							</th:block>
+				</th:block>
+				
+				<!-- 선택지급 사음품(선택) -->
+				<th:block th:if="${freegift.allYn} == 'N'">
+					<th:block th:each="freegiftGoods, k : ${freegiftGoodsList}">
+						<th:block th:if="${freegift.freegiftSq} == ${freegiftGoods.freegiftSq}">
+							<div class="gift">
+								<input type="radio" th:name="'rdi-gift'+${i.count}" th:id="'rdi-gift'+${i.count}+${k.count}" class="chk_img freegiftRdo" th:value="${freegiftGoods.freegiftValSq}" th:usepoint="${freegiftGoods.usePoint}"  allYn="N"> 
+								<label th:for="'rdi-gift'+${i.count}+${k.count}"> 
+									<span class="thumb"><img src="http://ts5000.ipdisk.co.kr:89/images/pc/thumb/tmp_gift1.jpg" width="" alt=""></span>
+									<span class="name" th:text="${freegiftGoods.goodsNm}"></span> 
+									<span th:if="${freegiftGoods.usePoint} < 1" class="deduct" th:text="무료"></span>
+									<span th:if="${freegiftGoods.usePoint} > 0" class="deduct" th:text="|- ${freegiftGoods.usePoint} P|"></span>
+								</label>
+							</div>
 						</th:block>
-						<div class="gift">
-							<input type="radio" th:name="'rdi-gift'+${i.count}" th:id="${i.count}+'0'" class="chk_img freegiftRdo" value="noSel" usepoint="0" allYn="N"> 
-							<label th:for="${i.count}+'0'">
-								<span class="thumb"><img src="/images/pc/thumb/tmp_gift_empty.jpg" width=""alt=""></span> 
-								<span class="name">사은품 수령안함</span>
-								<span class="deduct">수령거부</span>
-							</label>
-						</div>
 					</th:block>
-				</div>
+					<div class="gift">
+						<input type="radio" th:name="'rdi-gift'+${i.count}" th:id="${i.count}+'0'" class="chk_img freegiftRdo" value="noSel" usepoint="0" allYn="N"> 
+						<label th:for="${i.count}+'0'">
+							<span class="thumb"><img src="/images/pc/thumb/tmp_gift_empty.jpg" width=""alt=""></span> 
+							<span class="name">사은품 수령안함</span>
+							<span class="deduct">수령거부</span>
+						</label>
+					</div>
+				</th:block>
 			</div>
-		</th:block>
+		</div>
+		
 		<div class="form_field">
 			<div class="agree_gift">
 				<p>
-					<input id="chk-agree_gift" type="checkbox">
-					<label for="chk-agree_gift"><span>동의합니다</span></label>
+					<input id="chk-agree_gift" type="checkbox"><label for="chk-agree_gift"><span>동의합니다</span></label>
 				</p>
 				<p class="txt">
 					사은품 지금에 대한 내용을 확인하였으며, 이에 동의합니다.
-					<button type="button" class="btn_link_popup" id="btn_infoGift_pop">
+					<button type="button" class="btn_underline"
+						id="btn_infoGift_pop">
 						<span>보기</span>
 					</button>
 				</p>
 			</div>
 		</div>
 	</div>
-</div> 
+</div> <!-- //사은품선택 -->
 
 <script th:inline="javascript">
 //할인관련정보 변수선언

+ 70 - 233
src/main/webapp/WEB-INF/views/web/order/OrderPaymentInfoWeb.html

@@ -13,257 +13,96 @@
  * 1.0  2021.02.01   jsh77b     최초 작성
  *******************************************************************************
  -->
+ <!-- 결제수단 선택 -->
 <div class="fold_head">
 	<a href="javascript:void(0)">
 		<div>
-			<div class="fold_tit"><span>결제수단 선택</span></div>
-			<div class="data"><span>STYLE24 간편결제</span></div>
+			<div class="fold_tit">
+				<span>결제수단 선택</span>
+			</div>
+			<div class="data">
+				<span>신용카드</span>
+			</div>
 		</div>
 	</a>
 </div>
 <div class="fold_cont" style="display: none;">
 	<div class="area_paymethod">
 		<div class="form_field">
-			<div class="radio_blk">
-				<div class="paymethod_radio">
-					<input type="radio" name="rdi-paymethod" id="rdi-paymethod-quick" value=""> 
-					<label for="rdi-paymethod-quick"><span>STYLE24 간편결제</span></label>
-					<div class="quickpay_bnr">
-						<span>3초면 결제 끝! 추가 혜택 할인과 함께 만나는 STYLE24 간편결제! 지금 바로 등록하세요!</span>
-						<button type="button" class="btn_close_bnr">
-							<span class="sr-only">닫기</span>
-						</button>
-					</div>
-				</div>
-				<div class="paymethod_box" style="display: none;">
-					<div class="card_quickpay">
-						<!-- 등록카드 없을때 -->
-						<div class="empty">
-							<button type="button" class="btn_addcard">
-								<span>결제수단 등록</span>
-							</button>
-						</div>
-						<!-- //등록카드 없을때 -->
-						
-						<!-- 등록카드 있을때 -->
-						<div class="list_card swiper-container">
-							<div class="swiper-wrapper">
-								<div class="swiper-slide">
-									<!-- 등록된 카드 -->
-									<div class="card">
-										<span class="logo_samsung">삼성카드</span>
-										<p class="number">
-											<span>9410</span> <span>09**</span> <span>****</span>
-											<span>1287</span>
-										</p>
-										<p class="name">삼성개인특별카드</p>
-										<select name="" id="" class="select_month">
-											<option value="">일시불</option>
-											<option value="">2개월 무이자</option>
-											<option value="">3개월 무이자</option>
-											<option value="">4개월 무이자</option>
-											<option value="">5개월 무이자</option>
-											<option value="">6개월 무이자</option>
-											<option value="">7개월</option>
-											<option value="">8개월</option>
-											<option value="">9개월</option>
-											<option value="">10개월</option>
-											<option value="">11개월</option>
-											<option value="">12개월</option>
-										</select>
-										<div class="etc">
-											<button type="button" class="btn_favorcard">
-												<span><i class="ico ico_star"></i><em class="sr-only">즐겨찾기</em></span>
-											</button>
-											<button type="button" class="btn_delcard">
-												<span><i class="ico ico_trash_wh"></i><em class="sr-only">카드삭제</em></span>
-											</button>
-										</div>
-									</div>
-									<!-- //등록된 카드 -->
-								</div>
-								<div class="swiper-slide">
-									<!-- 등록된 카드 -->
-									<div class="card">
-										<span class="logo_hyundai">현대카드</span>
-										<p class="number">
-											<span>9410</span> <span>09**</span> <span>****</span>
-											<span>1287</span>
-										</p>
-										<p class="name">현대 M3 카드</p>
-										<select name="" id="" class="select_month">
-											<option value="">일시불</option>
-											<option value="">2개월 무이자</option>
-											<option value="">3개월 무이자</option>
-											<option value="">4개월 무이자</option>
-											<option value="">5개월 무이자</option>
-											<option value="">6개월 무이자</option>
-											<option value="">7개월</option>
-											<option value="">8개월</option>
-											<option value="">9개월</option>
-											<option value="">10개월</option>
-											<option value="">11개월</option>
-											<option value="">12개월</option>
-										</select>
-										<div class="etc">
-											<button type="button" class="btn_favorcard active">
-												<span><i class="ico ico_star"></i><em class="sr-only">즐겨찾기</em></span>
-											</button>
-											<button type="button" class="btn_delcard">
-												<span><i class="ico ico_trash_wh"></i><em class="sr-only">카드삭제</em></span>
-											</button>
-										</div>
-									</div>
-									<!-- //등록된 카드 -->
-								</div>
-								<div class="swiper-slide">
-									<!-- 카드추가버튼 -->
-									<button type="button" class="btn_addcard">
-										<span>결제수단 등록</span>
-									</button>
-									<!-- //카드추가버튼 -->
-								</div>
-							</div>
-							<div class="swiper-button-next"></div>
-							<div class="swiper-button-prev"></div>
-						</div>
-						<!-- //등록카드 있을때 -->
-					</div>
-					<ul class="info_quick">
-						<li>결제수단 등록 한번으로 간편하게 결제하실 수 있습니다.</li>
-						<li>국내 8개 카드에 대해 이용 가능합니다. (법인카드,기프트카드,해외카드 제외)</li>
-						<li>일반 신용카드의 할인혜택은 적용되지 않습니다.</li>
-					</ul>
-				</div>
-			</div>
-			<div class="radio_blk">
-				<div class="paymethod_radio">
-					<input type="radio" name="rdi-paymethod" id="rdi-paymethod-normal" value=""> 
-					<label for="rdi-paymethod-normal"><span>일반 결제</span></label>
-				</div>
-				<div class="paymethod_box" style="display: none;">
-					<ul class="sel_method">
-						<li>
-							<input type="radio" name="rdi-paynormal" id="rdi-paynormal1" value="KCP|G014_30"> 
-							<label for="rdi-paynormal1"><span>신용카드</span></label>
-						</li>
-						<li>
-							<input type="radio" name="rdi-paynormal" id="rdi-paynormal2" value="KCP|G014_10"> 
-							<label for="rdi-paynormal2"><span>실시간계좌이체</span></label>
-						</li>
-						<li>
-							<input type="radio" name="rdi-paynormal" id="rdi-paynormal3" value="KCP|G014_20"> 
-							<label for="rdi-paynormal3"><span>무통장입금</span></label>
-						</li>
-						<li>
-							<input type="radio" name="rdi-paynormal" id="rdi-paynormal4" value="KCP|G014_60"> 
-							<label for="rdi-paynormal4"><span>휴대폰 결제</span></label>
-						</li>
-						<li>
-							<input type="radio" name="rdi-paynormal" id="rdi-paynormal5" value="KAKAO|G014_99"> 
-							<label for="rdi-paynormal5">
-								<span>
-									<em class="sr-only">카카오페이 결제</em>
-									<em class="payimg kakao"></em>
-								</span>
-							</label>
-						</li>
-						<li>
-							<input type="radio" name="rdi-paynormal" id="rdi-paynormal6" value="NAVER|G014_99"> 
-							<label for="rdi-paynormal6">
-								<span>
-									<em class="sr-only">네이버페이 결제</em>
-									<em class="payimg naver"></em>
-								</span>
-							</label>
-						</li>
-						<li>
-							<input type="radio" name="rdi-paynormal" id="rdi-paynormal7" value="PAYCO|G014_30"> 
-							<label for="rdi-paynormal7">
-								<span>
-									<em class="sr-only">페이코 결제</em>
-									<em class="payimg payco"></em>
-								</span>
-							</label>
-						</li>
-					</ul>
-					<div class="agree_insurance">
-						<input id="chk-insurance" type="checkbox"> 
-						<label for="chk-insurance"> 
-							<span>소비자 피해 보상보험 신청&nbsp;&nbsp;<em class="tmark_optional">(선택)</em></span>
-							<button type="button" class="btn_link_popup" id="">
-								<span>FAQ확인</span>
-							</button>
+			<div class="paymethod_box">
+				<ul class="sel_method">
+					<li>
+						<input type="radio" name="rdi-paynormal" id="payCreditCard" value="KCP|G014_30" checked="checked">
+						<label for="payCreditCard"><span>신용카드</span></label>
+					</li>
+					<li>
+						<input type="radio" name="rdi-paynormal" id="payCellphone" value="KCP|G014_60"> 
+						<label for="payCellphone"><span>휴대폰 결제</span></label>
+					</li>
+					<li>
+						<input type="radio" name="rdi-paynormal" id="payKakao" value="KAKAO|G014_99"> 
+						<label for="payKakao">
+							<span>
+								<em class="sr-only">카카오페이 결제</em>
+								<em class="payimg kakao"></em>
+							</span>
+						</label>
+					</li>
+					<li>
+						<input type="radio" name="rdi-paynormal" id="payNaver" value="NAVER|G014_99"> 
+						<label for="payNaver">
+							<span>
+								<em class="sr-only">네이버페이 결제</em>
+								<em class="payimg naver"></em>
+							</span>
 						</label>
-						<p>
-							‘전자상거래 등에서의 소비자보호에 관한 법률‘에 따라 현금 결제 시 서울보증보험㈜가 제공하는
-							소비자 피해보상보험을<br>신청할 수 있도록 해드리고 있습니다.
-							(2013.11.28부터 시행)
-						</p>
-					</div>
-				</div>
+					</li>
+					<li>
+						<input type="radio" name="rdi-paynormal" id="payPayco" value="PAYCO|G014_30"> 
+						<label for="payPayco">
+							<span>
+								<em class="sr-only">페이코 결제</em>
+								<em class="payimg payco"></em>
+							</span>
+						</label>
+					</li>
+					<li>
+						<input type="radio" name="rdi-paynormal" id="payRealBank" value="KCP|G014_10"> 
+						<label for="payRealBank"><span>실시간계좌이체</span></label>
+					</li>
+					<li>
+						<input type="radio" name="rdi-paynormal" id="payVirtualBank" value="KCP|G014_20"> 
+						<label for="payVirtualBank"><span>무통장입금</span></label>
+					</li>
+				</ul>
 			</div>
 		</div>
 		<div class="form_field">
 			<div class="agree_paymethod">
 				<input id="chk-agree_paymethod" type="checkbox">
-				<label for="chk-agree_paymethod"> 
-					<span>선택한 결제수단으로 향후 결제 이용에 동의합니다.&nbsp;&nbsp;<em class="tmark_optional">(선택)</em>
-				</span>
+				<label for="chk-agree_paymethod">
+					 <span>선택한 결제수단으로 향후 결제 이용에 동의합니다.&nbsp;&nbsp;
+						<em class="tmark_optional">(선택)</em>
+					</span>
 				</label>
 			</div>
 		</div>
-	</div>
-	<div class="area_paymentinfo">
-		<div class="paymentinfo">
-			<div class="payinfo_blk on">
-				<a href=""> 개인정보 제공에 대한 동의 <span>닫기</span>
-				</a>
-				<div class="infotxt">개인정보제공에 대한 동의 내용입니다.개인정보제공에
-					대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
-					내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
-					대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
-					내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
-					대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
-					내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
-					대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
-					내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
-					대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
-					내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
-					대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
-					내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
-					대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
-					내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.</div>
-			</div>
-			<div class="payinfo_blk">
-				<a href=""> 결제대행 서비스 약관 동의 <span>보기</span>
-				</a>
-				<div class="infotxt">결제대행서비스 약관 동의 내용입니다.결제대행서비스
-					약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
-					내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
-					약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
-					내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
-					약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
-					내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
-					약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
-					내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
-					약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
-					내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
-					약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
-					내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
-					약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
-					내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.</div>
-			</div>
-		</div>
-
-		<div class="agree_payment">위 주문내역을 확인 하였으며, 회원 본인은 결제에 동의합니다.</div>
-	</div>
-	<div class="area_paybtn">
 		<div class="form_field">
-			<button type="button" class="btn btn_primary btn_block" id="btn_payment">동의 후 123,456,789원 결제하기</button>
+			<div class="agree_insurance">
+				<input id="chk-insurance" type="checkbox"> 
+					<label for="chk-insurance"> 
+						<span>소비자 피해 보상보험 신청&nbsp;&nbsp;<em class="tmark_optional">(선택)</em></span> 
+						<a href="" class="btn_underline"><span>FAQ확인</span></a>
+				</label>
+				<p>
+					‘전자상거래 등에서의 소비자보호에 관한 법률‘에 따라 현금 결제 시 서울보증보험㈜가 제공하는 소비자
+					피해보상보험을<br>신청할 수 있도록 해드리고 있습니다. (2013.11.28부터 시행)
+				</p>
+			</div>
 		</div>
 	</div>
-</div> 
+</div> <!-- //결제수단 선택 -->
+
 
 <script th:inline="javascript">
 var dispYn = [[${order.dispYn}]]; // 노출여부
@@ -275,10 +114,8 @@ $(document).ready( function() {
 	// 화면펼침
 	if (dispYn == "Y") {
 		$("#paymentInfo .fold_head").addClass("on");
-		$("#paymentInfo .fold_cont").css("display", "block");
+		//$("#paymentInfo .fold_cont").css("display", "block");
 		$("#rdi-paymethod-normal").attr("checked", "checked");
-		$(".radio_blk").eq(1).addClass("on");
-		$(".radio_blk").eq(1).find(".paymethod_box").show();
 	}
 });
 </script>

+ 5 - 0
src/main/webapp/ux/pc/css/common.css

@@ -806,6 +806,7 @@ content: "〉";font-size: 12px;padding-left: 8px;
 .itemPrice_original {position: relative;margin-left: 5px;line-height: 16px;font-size: 14px;font-weight: 300;color: rgb(204, 204, 204);}
 .itemPrice_original::after{content: '';display: inline-block;width: 100%;height: 1px;background: rgb(204, 204, 204);position: absolute;top: 50%;left: 0;bottom:auto;right:auto;transform: translateY(-50%);}
 .itemPercent {position: absolute;top: 0px;right: 0px;bottom: auto;left: auto;margin-left: 15px;line-height: 16px;font-size: 16px;font-weight: 300;color: #fd4802;}
+.itemViewCount {display:inline-block; height:30px; margin-top:20px; padding:7px 14px; border:2px solid #fd4802; color:#fd4802; font-size:14px; font-weight:300; line-height:1; border-radius:15px;}
 
 /* items Ellipsis */
 .itemBrand {position: relative;overflow: hidden;white-space: normal;overflow-wrap: break-word;display: block; max-width:95%;}
@@ -1171,6 +1172,10 @@ input[type="file"] {
   color: #bbb;
   background-color: #f5f5f5 !important;
 } 
+.select_custom[disabled] .combo .select > div {
+  position:relative;
+  z-index:1;
+}
 .select_custom .combo .list>li[aria-disabled="true"] {
 	text-decoration: line-through;
   /*background: #f5f5f5;*/

+ 54 - 7
src/main/webapp/ux/pc/css/layout.css

@@ -2335,7 +2335,7 @@ dp_banner_slide03
 	.od .od_cont button.btn_sm {height:34px; min-width:70px; padding:9px 13px; font-size:14px; font-weight:200;}
 	.od .od_cont button.btn_dark {font-weight:200;}
 	.od .od_cont button.btn_default {border-color:#a7a7a7; color:#222;}
-	.od .od_cont .form_control {min-width:400px; height:42px; padding-left:18px; font-size:14px;} 
+	.od .od_cont .form_control {min-width:400px; height:42px; padding-left:18px; color:#222; font-size:14px;} 
 	.od .od_cont .sec_head {margin-bottom:60px;}
 	.od .od_cont .sec_head .tbl .number {color:#fd4802; font-weight:500;}
 	.od .od_cont .sec_head .tbl td {text-align:left;}
@@ -2373,7 +2373,7 @@ dp_banner_slide03
 	.od .od_side {float:right; width:320px;}
 	.od .od_side h3 {color:#222; font-size:24px; font-weight:500;}
 	.od .od_side h4 {font-size:18px; font-weight:500; margin-bottom:20px;}
-	.od .od_side .item_gd figure {position:relative; height:150px;}
+	.od .od_side .item_gd figure {position:relative; min-height:150px;}
 	.od .od_side .item_gd figure::after {content: ''; display: block; clear: both;}
 	.od .od_side .item_gd figure .thumb {float:left; width:100px; height:150px; padding-top:0;} 
 	.od .od_side .item_gd figure figcaption {display:table-cell; width:178px; height:150px; vertical-align:middle; padding-left:20px}
@@ -2424,6 +2424,7 @@ dp_banner_slide03
 	.od .od_side .area_order .totalprice_box dl dd span {font-size:24px;}
 	.od .od_side .area_order .totalprice_box .info_point {margin-top:12px; color:#888; font-size:14px; font-weight:300; text-align:right; line-height:16px;}
 	.od .od_side .area_order .totalprice_box .info_point .save_point {display:inline-block; padding-left:22px; height:16px; background:url('/images/pc/ico_point.png') no-repeat 0 50%; color:#fd4802;}
+	.od .od_side .area_order .totalprice_box .info_extra {margin-top:12px; color:#888; font-size:14px; font-weight:300; text-align:left; line-height:16px;}
 	.od .od_side .area_order .btn_box {padding:0px 30px 35px;}
 	.od .od_side .area_order .btn_box .btn {height:60px; font-weight:300; padding:20px}
 	.od .od_side .area_salecoupon {margin-top:35px}
@@ -2450,6 +2451,8 @@ dp_banner_slide03
 	.od .shopping_bag  {}
 	.od .shopping_bag table th,
 	.od .shopping_bag table td {vertical-align:middle;}
+	.shopping_bag .nodata {padding-top:110px;}
+	.shopping_bag .nodata .txt_box::before {background-image:url('/images/pc/ico_cart_empty.png');}
 	.shopping_bag .sec_head table .form_field > div {display:inline-block; margin-left:30px;}
 	.shopping_bag .sec_head table .form_field span {display:inline-block; height:22px; line-height:22px;}
 	.shopping_bag .sec_head table .form_field span .tag {margin-right:5px}
@@ -2458,8 +2461,35 @@ dp_banner_slide03
 	.shopping_bag .sec_body .sec_select > div .btn {position:absolute; right:0; top:50%; transform:translateY(-50%); height:34px; padding:10px; font-size:14px; font-weight:200;}
 	.shopping_bag .sec_body .sec_part {margin-bottom:60px;}
 	.shopping_bag .sec_body .sec_part:last-child {margin-bottom:0;}
-	.shopping_bag .sec_body .sec_part h3 {margin-bottom:30px}
+	/* .shopping_bag .sec_body .sec_part h3 {margin-bottom:30px} */
+	.shopping_bag .sec_body .sec_part h3{padding-bottom: 30px;border-bottom: 1px solid #ddd;}
 	.shopping_bag .sec_body .sec_part h3 .tit_info {margin-left:15px; color:#666; font-size:16px; font-weight:300;}
+	.shopping_bag .sec_body .sec_part h4 .tit_info {margin-left:10px;color: #666;font-size: 16px;font-weight: 300;}
+	.shopping_bag .area_part {border-top: 0;}
+	.shopping_bag .area_part {padding-top: 40px;}
+	.shopping_bag .area_part + .area_part{margin-top: 0px;padding-top: 0px;}
+	.shopping_bag .area_part + .area_part h4{padding-top: 0px;}
+	.shopping_bag .area_part + .area_part .part_goods .goods_cont:last-child{padding-bottom: 0px;}
+	.shopping_bag .area_part + .area_part .part_goods .goods_cont .goods_info:last-child {padding-bottom:0px;}
+	.shopping_bag .area_part + .area_part .part_goods .goods_cont .goods_info:last-child{border-bottom: 0px;}
+	.shopping_bag .part_goods .goods_cont .goods_info:last-child{margin-bottom: 0px;padding-bottom: 40px;border-bottom: 1px dashed #ddd;}
+	
+
+	/* od_shopping_Bag 실시간조회상품 */
+	.container .wrap .content.od_realtime {position:relative; max-width:1460px; margin-top:120px;}
+	.od .od_realtime {}
+	.od_realtime .swiper-container {padding:0px;}
+	.od_realtime .swiper-container .swiper-wrapper {}
+	.od_realtime .swiper-container .swiper-wrapper .swiper-slide .item_prod {width:100%}
+	.od_realtime .swiper-container .swiper-wrapper .swiper-slide .item_state {padding:0;}
+	.od_realtime .swiper-button-prev {left:-70px; top:275px}
+	.od_realtime .swiper-button-next {right:-70px; top:275px}
+	.od_realtime .swiper-button-prev::after,
+	.od_realtime .swiper-button-next::after {content: ''; display:inline-block; width:27.5px; height:50px; background:url(/images/pc/ico_arr_lg.png) no-repeat;}
+	.od_realtime .swiper-button-prev::after {background-position:0 50%;}
+	.od_realtime .swiper-button-next::after {background-position:100% 50%;}
+	.od_realtime .swiper-container .swiper-pagination {position:relative; display:block; left:auto; right:auto; bottom:auto; margin-top:60px}
+	@media screen and (max-width:1460px) {}
 
 	/* od_shopping_Bag 추천상품 */
 	.container .wrap .content.od_recommend {position:relative; max-width:1460px; margin-top:120px;}
@@ -2482,6 +2512,7 @@ dp_banner_slide03
 	.odPayment .icon_tag {display:inline-block; vertical-align:top;}
 	.odPayment .icon_tag::after {content:''; clear:both; display:inline-block; font-weight:300;}
 	.odPayment .icon_tag .tag {float:left; margin-left:6px}
+	.odPayment .input_wrap > .btn.btn_dark.btn_sm {height:42px; min-width:70px; padding:13px; font-size:14px; font-weight:300;}
 	.odPayment .foldGroup .fold_head .data .total_gift,
 	.odPayment .foldGroup .fold_head .data .total_deduct {color:#fd4802; font-weight:500;}
 	.odPayment .foldGroup .fold_head .data .maxdisc_amount {padding:0; margin:0; color:#fd4802;}
@@ -2490,6 +2521,8 @@ dp_banner_slide03
 	.odPayment .fold_cont .area_overseas,
 	.odPayment .fold_cont .area_customitem,
 	.odPayment .fold_cont .area_selpoint {padding-top:30px; margin-top:30px; border-top:1px dashed #ddd;}
+	.odPayment .fold_cont .area_selpoint input[type="text"]:read-only,
+	.odPayment .fold_cont .area_selpoint input[type="text"]:disabled {background:#fff;}
 	.odPayment .fold_cont .area_overseas .info_txt,
 	.odPayment .fold_cont .area_customitem .info_txt {margin-top:25px;}
 
@@ -2547,7 +2580,7 @@ dp_banner_slide03
 	.odPayment .gift_box .form_field .gift label > span {display:inline-block; width:100%;}
 	.odPayment .gift_box .form_field .gift label .thumb {position:absolute; left:50px; top:10px; width:77px; height:98px; background-color:#eee;}
 	.odPayment .gift_box .form_field .gift label .thumb img {width:100%;}
-	.odPayment .gift_box .form_field .gift label .name {width:160px; color:#666; font-size:14px; line-height:1.4; font-weight:200;}
+	.odPayment .gift_box .form_field .gift label .name {width:100%; color:#666; font-size:14px; line-height:1.4; font-weight:200;}
 	.odPayment .gift_box .form_field .gift label .deduct {margin-top:5px;color:#fd4802; font-weight:300; font-size:14px;}
 	.odPayment .form_field .agree_gift {display:block; width:100%; padding-top:30px; margin-top:30px; border-top:1px dashed #ddd; text-align:center;}
 	.odPayment .form_field .agree_gift .btn_underline {display:inline-block; margin-left:10px; padding:0px; border-bottom-color:#888;}
@@ -2560,7 +2593,6 @@ dp_banner_slide03
 	.odPayment .area_seldiscount dl > div dt {width:170px; margin-right:0;}
 	.odPayment .area_seldiscount dl > div dd {width:485px;}
 	.odPayment .area_seldiscount .sale_coupon_box {}
-	.odPayment .area_seldiscount .sale_coupon_box button.btn_sm {height:42px; min-width:70px; padding:13px; font-size:14px; font-weight:300;}
 	.odPayment .area_seldiscount .sale_coupon_box .btn_default {width:80px; margin-left:14px; margin-top:-13px; vertical-align:top;}
 	.odPayment .area_seldiscount .sale_coupon_box .maxdisc_amount {color:#fd4802; font-weight:300;}
 	.odPayment .area_seldiscount .sale_coupon_box .form_field {margin-top:18px}
@@ -2591,8 +2623,8 @@ dp_banner_slide03
 	.odPayment .area_selpoint .form_field .useable_point em {font-weight:500;}
 	.odPayment .area_selpoint .form_field .remain_point {margin-right:10px; color:#fd4802; font-size:14px; font-weight:200;}
 	.odPayment .area_selpoint .form_field p {margin-top:15px; color:#888; font-size:14px;}
-	.odPayment .area_selpoint .form_field .agree_receipt {margin-top:20px;}
-	.odPayment .area_selpoint .form_field .agree_receipt .info_box {margin-top:10px;}
+	/*.odPayment .area_selpoint .form_field .agree_receipt {margin-top:20px;}
+	.odPayment .area_selpoint .form_field .agree_receipt .info_box {margin-top:10px;}*/
 
 	.odPayment .fold_paymethod .fold_cont {margin-top:-10px;}
 	.odPayment .area_paymethod {}
@@ -2685,6 +2717,12 @@ dp_banner_slide03
 	.odPayment .area_paybtn .btn {height:80px; font-size:20px; font-weight:300;}
 	.odPayment .area_paybtn .btn em {font-weight:500;}
 
+	.odPayment .extra_pay {padding:0px 30px 40px; margin-bottom: 20px; border-top:1px solid #222; border-bottom:1px solid #ddd;}
+	.odPayment .extra_pay .tit_pay {padding:30px 0px; line-height:1; font-size:24px; font-weight:500;}
+	.odPayment .extra_pay .area_paymethod {}
+	.odPayment .extra_pay .area_paymethod .paymethod_box .sel_method li {width:50%;}
+
+
 	/* od_completed */
 	.od .completed {}
 	.completed .tbl table td .btn.btn_sm.btn_default {color:#222; border:1px solid #a7a7a7;}
@@ -2822,6 +2860,15 @@ dp_banner_slide03
 	.modal.opt_modify_pop .area_order .opt_count .number_count .plus::after {content:''; background-position:100% 0;}
 	.modal.opt_modify_pop .area_order .opt_count .number_count .minus::after {content:''; background-position:0 0;}
 	.modal.opt_modify_pop .area_order .opt_count .number_count input[type='text'] {width:44px; height:40px; padding:0; text-align:center; color:#222; font-size:15px; font-weight:200; border:none;}
+	
+	/* moresale_pop */
+	.modal.moresale_pop .area_benefit {margin-bottom:30px; padding-top:4px; color:#fd4802; font-size:14px;}
+	.modal.moresale_pop .area_benefit::after {clear:both; display:block;}
+	.modal.moresale_pop .area_benefit .tag {float:left; width:55px; margin-top:-4px;}
+	.modal.moresale_pop .area_benefit p {float:left;}
+	.modal.moresale_pop .area_benefit p span {float:left;  position:relative; padding:0px 12px;}
+	.modal.moresale_pop .area_benefit p span::before {content:''; position:absolute; width:1px; height:14px; left:0px; top:50%; transform:translateY(-50%); background:#ddd;}
+	.modal.moresale_pop .area_benefit p span:first-child::before {display:none;}
 
 	/**** od_odPayment_popup ****/
 	/* couponModify_pop */	

+ 46 - 101
src/main/webapp/ux/pc/js/mypage.js

@@ -4,6 +4,12 @@ var fnGoToOrderDetail = function(param) {
 	cfnGoToPage(_PAGE_MYPAGE_ORDER_DETAIL + ordNo);
 }
 
+// 상품상세 페이지 이동 처리
+var fnGoToGoodsDetail = function(param) {
+	let goodsCd = $(param).attr('goodsCd');
+	cfnGoToPage(_PAGE_GOODS_DETAIL + goodsCd);
+}
+
 // 배송조회 버튼 클릭 이벤트
 var fnGetDeliveryInfo = function(param) {
 	let invoiceNo = $(param).attr('invoiceNo');
@@ -15,21 +21,17 @@ var fnGetDeliveryInfo = function(param) {
 
 // 구매확정 버튼 클릭 이벤트
 var fnDecideOrder = function(param) {
-	let ordDtlNoArr = $(param).parent().parent().find('input[name=ordDtlNo]');
-	let ordDtlStatArr = $(param).parent().parent().find('input[name=ordDtlStat]');
-	
 	let orderDecisionArr = [];
-	$.each(ordDtlNoArr, function(idx, item) {
-		if (ordDtlStatArr[idx].value == 'G013_60') {
-			orderDecisionArr.push(item.value);
-		}
-	});
-	
+	let ordNo = $(param).attr('ordNo');
+	let ordDtlNo = $(param).attr('ordDtlNo');
+
+	orderDecisionArr.push(ordDtlNo);
+
 	if (orderDecisionArr.length == 0) {
 		mcxDialog.alert('구매확정 가능한 상품이 없습니다.');
 		return false;
 	}
-	
+
 	mcxDialog.confirm('구매확정 처리를 하시겠습니까?', {
 		cancelBtnText: "취소",
 		sureBtnText: "확인",
@@ -54,78 +56,29 @@ var fnDecideOrder = function(param) {
 }
 
 // 리뷰작성 버튼 클릭 이벤트
-var fnCreateReview = function(param, bannerYn) {
-	let ordDtlNoArr;
-	let ordDtlStatArr;
-	let reviewSqArr;
-
-	if (bannerYn == 'Y') {
-		ordDtlNoArr = $(param).parent().parent().find('input[name=ordDtlNo]');
-		ordDtlStatArr = $(param).parent().parent().find('input[name=ordDtlStat]');
-		reviewSqArr = $(param).parent().parent().find('input[name=reviewSq]');
-	} else {
-		ordDtlNoArr = $(param).parent().parent().parent().parent().find('input[name=ordDtlNo]');
-		ordDtlStatArr = $(param).parent().parent().parent().parent().find('input[name=ordDtlStat]');
-		reviewSqArr = $(param).parent().parent().parent().parent().find('input[name=reviewSq]');
-	}
-	
-	let canReviewSqArr = [];
-	$.each(ordDtlNoArr, function(idx, item) {
-		if (ordDtlStatArr[idx].value == 'G013_70' && reviewSqArr[idx].value == 0) {
-			canReviewSqArr.push(item.value);
-		}
-	});
-	
-	if (canReviewSqArr.length == 0) {
-		mcxDialog.alert('리뷰작성 가능한 상품이 없습니다.');
-		return false;
-	}
-	
+var fnCreateReview = function(param) {
+	let ordNo = $(param).attr('ordNo');
+	let ordDtlNo = $(param).attr('ordDtlNo');
+
 	// TODO
 	// 리뷰 작성페이지 이동
 	let data = {};
-	
+
 	data.ordNo = ordNo;
-	data.ordDtlNoArr = canReviewSqArr;
-	
+	data.ordDtlNo = ordDtlNo;
+
 	var jsonData = JSON.stringify(data);
 	
-	//gagajf.ajaxJsonSubmit('/mypage/order/decision'
-	//	, jsonData
-	//	, function() {
-	//		cfnGoToPage(_PAGE_MYPAGE_ORDER_DETAIL + ordNo);
-	//	});
-	
 }
 
 // 장바구니 담기 버튼 클릭 이벤트
-var fnCreateCart = function(param, bannerYn) {
-	let ordDtlNoArr = '';
-	let ordDtlStatArr = '';
-	let reviewSqArr = '';
-
-	if (bannerYn == 'Y') {
-		ordDtlNoArr = $(param).parent().parent().find('input[name=ordDtlNo]');
-		ordDtlStatArr = $(param).parent().parent().find('input[name=ordDtlStat]');
-		reviewSqArr = $(param).parent().parent().find('input[name=reviewSq]');
-	} else {
-		ordDtlNoArr = $(param).parent().parent().parent().parent().parent().find('input[name=ordDtlNo]');
-		ordDtlStatArr = $(param).parent().parent().parent().parent().parent().find('input[name=ordDtlStat]');
-		reviewSqArr = $(param).parent().parent().parent().parent().parent().find('input[name=reviewSq]');
-	}
-	
+var fnCreateCart = function(param) {
 	let cartArr = [];
-	$.each(ordDtlNoArr, function(idx, item) {
-		if (bannerYn != 'Y' || (bannerYn == 'Y' && ordDtlStatArr[idx].value == 'G013_70' && reviewSqArr[idx].value > 0)) {
-			cartArr.push(item.value);
-		}
-	});
-	
-	if (cartArr.length == 0) {
-		mcxDialog.alert('장바구니에 담을 상품이 없습니다.');
-		return false;
-	}
-	
+	let ordNo = $(param).attr('ordNo');
+	let ordDtlNo = $(param).attr('ordDtlNo');
+
+	cartArr.push(ordDtlNo);
+
 	// TODO
 	// 장바구니 담기 처리
 	let data = {};
@@ -135,11 +88,6 @@ var fnCreateCart = function(param, bannerYn) {
 	
 	var jsonData = JSON.stringify(data);
 	
-	//gagajf.ajaxJsonSubmit('/mypage/order/decision'
-	//	, jsonData
-	//	, function() {
-	//		cfnGoToPage(_PAGE_MYPAGE_ORDER_DETAIL + ordNo);
-	//	});
 }
 
 // 선물하기 SMS 재전송 버튼 클릭 이벤트
@@ -152,25 +100,24 @@ var fnReSendSms = function(param) {
 
 // 반품/취소/교환 버튼 클릭 이벤트
 var fnCreateChange = function(param, gubun) {
-	if (ordNo == null) {
-		ordNo = $(param).attr('ordNo');
-	}
-	
-	let ordDtlNoArr = $(param).parent().parent().parent().parent().find('input[name=ordDtlNo]');
-	
-	let changeArr = [];
-	$.each(ordDtlNoArr, function(idx, item) {
-		changeArr.push(item.value);
-	})
-	
+	let ordNo = $(param).attr('ordNo');
+	let ordDtlNo = $(param).attr('ordDtlNo');
+
 	$('#' + gubun + 'Form input[name=ordNo]').val(ordNo);
-	$('#' + gubun + 'Form input[name=ordDtlNoArr]').val(changeArr);
+	$('#' + gubun + 'Form input[name=ordDtlNo]').val(ordDtlNo);
+	mcxDialog.alertC(gubun,  {
+		sureBtnText: "확인",
+		sureBtnClick: function() {
+			if (gubun == 'cancel') {
+				document.cancelForm.submit();
+			} else if (gubun == 'return') {
+				document.returnForm.submit();
+			} else if (gubun == 'exchange') {
+				document.exchangeForm.submit();
+			}
+		}
+	});
 	
-	if (gubun == 'cancel') {
-		document.cancelForm.submit();
-	} else {
-		document.exchangeForm.submit();
-	}
 }
 
 // 주문 내역 삭제 처리
@@ -180,15 +127,13 @@ var fnDeleteOrder = function() {
 		sureBtnText: "확인",
 		sureBtnClick: function(){
 			let data = {};
-			
+
 			data.ordNo = ordNo;
-			
+
 			var jsonData = JSON.stringify(data);
-			gagajf.ajaxJsonSubmit('/mypage/order/delete'
-				, jsonData
-				, function() {
-					cfnGoToPage(_PAGE_MYPAGE);
-				});
+			gagajf.ajaxJsonSubmit('/mypage/order/delete', jsonData, function() {
+				cfnGoToPage(_PAGE_MYPAGE);
+			});
 		}
 	});
 };