상품이미지 dex5 관련 개발중

style24.admin/src/main/java/com/style24/admin/biz/dao/TsaGoodsDao.java

@@ -2,6 +2,8 @@ package com.style24.admin.biz.dao;
 
 import java.util.Collection;
 
+import org.springframework.dao.DataAccessException;
+
 import com.style24.core.support.annotation.ShopDs;
 import com.style24.persistence.domain.AdKeyword;
 import com.style24.persistence.domain.AdKeywordGoods;
@@ -1013,5 +1015,31 @@ public interface TsaGoodsDao {
 	 */
 	Collection<GoodsImg> getGoodsImageList(GoodsImg goodsImg);
 
+	/**
+	 * 상품이미지 전체 삭제
+	 * @param goodsImg - 상품이미지 정보
+	 * @throws DataAccessException
+	 * @author eskim
+	 * @since 2020. 12. 21
+	 */
+	public void deleteGoodsImageTotal(GoodsImg goodsImg);
+
+	/**
+	 * 상품이미지 삭제
+	 * @param goodsImg - 상품이미지 정보
+	 * @throws DataAccessException
+	 * @author eskim
+	 * @since 2020. 12. 21
+	 */
+	public void deleteGoodsImage(GoodsImg goodsImg);
+
+	/**
+	 * 상품이미지 등록
+	 * @param goodsImg - 상품이미지 정보
+	 * @throws DataAccessException
+	 * @author eskim
+	 * @since 2020. 12. 21
+	 */
+	public void createGoodsImage(GoodsImg goodsImg);
 
 }

style24.admin/src/main/java/com/style24/admin/biz/service/TsaGoodsService.java

@@ -2584,5 +2584,28 @@ public class TsaGoodsService {
 		return goodsDao.getGoodsImageList(goodsImg);
 	}
 
+	/**
+	 * 상품이미지 저장 처리
+	 * @param goodsImgList - 상품이미지 목록
+	 * @throws AdmBizException
+	 * @author eskim
+	 * @since 2020. 12. 21
+	 */
+	@Transactional("shopTxnManager")
+	public void saveGoodsImageList(Collection<GoodsImg> goodsImgList){
+		int index = 0;
+		for (GoodsImg goodsImg : goodsImgList) {
+			// 상품이미지 전체 삭제
+			if (index++ == 0) {
+				goodsDao.deleteGoodsImageTotal(goodsImg);
+			}
+
+			if (!goodsImg.getMode().equals("D")) {
+				// 상품이미지 등록
+				goodsImg.setRegNo(TsaSession.getInfo().getUserNo());
+				goodsDao.createGoodsImage(goodsImg);
+			}
+		}
+	}
 
 }

style24.admin/src/main/java/com/style24/admin/biz/web/TsaGoodsController.java

@@ -1,5 +1,6 @@
 package com.style24.admin.biz.web;
 
+import java.io.File;
 import java.util.ArrayList;
 import java.util.Collection;
 
@@ -16,6 +17,7 @@ import org.springframework.web.bind.annotation.PathVariable;
 import org.springframework.web.bind.annotation.PostMapping;
 import org.springframework.web.bind.annotation.RequestBody;
 import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestMethod;
 import org.springframework.web.bind.annotation.ResponseBody;
 import org.springframework.web.servlet.ModelAndView;
 
@@ -64,6 +66,7 @@ import com.gagaframework.web.rest.server.GagaResponse;
 import com.gagaframework.web.rest.server.GagaResponseStatus;
 import com.gagaframework.web.util.GagaDateUtil;
 import com.gagaframework.web.util.GagaFileUtil;
+import com.gagaframework.web.util.GagaStringUtil;
 
 /**
  * 상품관리 Controller
@@ -986,6 +989,148 @@ public class TsaGoodsController extends TsaBaseController {
 		return mav;
 	}
 
+	/**
+	 * 상품 썸네일 이미지 저장 처리
+	 * @param goodsImgList - 상품이미지 목록
+	 * @return
+	 * @throws Exception
+	 * @author eskim
+	 * @since 2020. 12. 21
+	 */
+	@RequestMapping(value = "/thumbnail/image/save", method = RequestMethod.POST)
+	@ResponseBody
+	public GagaResponse saveGoodsThumbnailImageList(@RequestBody Collection<GoodsImg> goodsImgList) throws Exception {
+		if (goodsImgList == null || goodsImgList.isEmpty())
+			throw new IllegalStateException(message.getMessage("FAIL_1001"));
+
+		String dextUploadPath = env.getProperty("upload.dext.target.path");
+		String goodsUploadPath = env.getProperty("upload.goods.target.path");
+
+		int index = 1;
+
+		String strBrandNo = "";
+		log.info("[saveGoodsThumbnailImageList] goodsImgList = {}", goodsImgList);
+
+		// 오류 파일 목록
+		Collection<File> errorFileList = new ArrayList<File>();
+
+		// 1.업로드된 파일 rename 및 순서 재정렬
+		for (GoodsImg goodsImg : goodsImgList) {
+			// dx5에서 삭제한 파일은 skip
+			if (goodsImg.getMode().equals("D")) {
+				continue;
+			}
+
+			// 상품의 브랜드 번호 추출
+			if (strBrandNo.isEmpty()) {
+				Goods goods = new Goods();
+				goods.setGoodsCd(goodsImg.getGoodsCd());
+				log.info("[saveGoodsThumbnailImageList] goods = {}", goods);
+				Goods goodsInfo = goodsService.getGoods(goods);
+				if (goodsInfo == null || goodsInfo.getGoodsCd().isEmpty())
+					throw new IllegalStateException(message.getMessage("FAIL_1001"));
+
+				log.info("[saveGoodsThumbnailImageList] goodsInfo = {}", goodsInfo);
+				strBrandNo = String.valueOf(goodsInfo.getBrandNo());
+			}
+
+			if (goodsImg.getMode().equals("C")) { // 업로드 된 파일 rename 처리
+//				String newFilename = goodsImg.getGoodsCd()
+//						+ "_" + goodsImg.getColorCd()
+//						+ "_" + String.valueOf(index)
+//						+ "(" + GagaDateUtil.getTodayTime() + ")"
+//						+ "." + StringUtils.getFilenameExtension(goodsImg.getSysImgNm());
+				String newFilename = goodsImg.getSysImgNm();
+
+				String brandDir = GagaFileUtil.getConcatenationPath(GagaStringUtil.getLPadding(strBrandNo, 10, "0"),GagaDateUtil.getToday()); // 브랜드/UPLOAD 일 YYYYMMDD
+
+				File uniqueFile = GagaFileUtil.getUniqueFile(new File(GagaFileUtil.getConcatenationPath(goodsUploadPath, brandDir, newFilename)));
+				File newFile = new File(GagaFileUtil.getConcatenationPath(goodsUploadPath, brandDir, uniqueFile.getName()));
+				log.info("newFile.getPath(): {}", newFile.getPath());
+
+				// resizing 처리 시 오류가 발생할 경우 삭제하기 위해 설정
+				errorFileList.add(newFile);
+
+				File oldFile = new File(GagaFileUtil.getConcatenationPath(dextUploadPath, goodsImg.getSysImgNm()));
+				log.info("oldFile.getPath(): {}", oldFile.getPath());
+
+				boolean copyFlag = GagaFileUtil.copyFile(oldFile, newFile);
+				if (copyFlag) {
+					//기존이미지 삭제
+					GagaFileUtil.deleteFile(oldFile.getPath());
+				}
+
+//				// 1.1.Rename a file
+//				oldFile.renameTo(newFile);
+//
+//				Image srcImg = StyleImageUtils.getImageObject(newFile);
+//				int width = srcImg.getWidth(null);
+//				int height = srcImg.getHeight(null);
+//
+//				if ((width == 1079 && height == 1499) || (width == 750 && height == 1041)) {
+//					// 1.2.Resizing
+//					Collection<File> resizeFileList = StyleImageUtils.resizeGoodsImage(goodsUploadPath, newFile.getName());
+//
+//					// resizing 처리 시 오류가 발생할 경우 삭제하기 위해 설정
+//					errorFileList.addAll(resizeFileList);
+//				} else if (width == 1000 && height == 1000) {
+//					// 외부몰연동용 이미지로 설정
+//					goodsImg.setExtmallImgYn("Y");
+//
+//					// 1.3.외부몰용 대표이미지 type5 폴더에 등록
+//					File resizeFile = new File(GagaFileUtil.getConcatenationPath(goodsUploadPath, "type5", newFile.getName()));
+//					//resizeFile.createNewFile();
+//					boolean copyFlag = GagaFileUtil.copyFile(newFile, resizeFile);
+//					//삭제해야하나?
+//					if (copyFlag) {
+//						//기존이미지 삭제
+//						GagaFileUtil.deleteFile(newFile.getPath());
+//					}
+//
+//					// resizing 처리 시 오류가 발생할 경우 삭제하기 위해 설정
+//					errorFileList.add(resizeFile);
+//				} else {
+//					// 오류가 발생했으므로 rename된 파일과 resizing된 파일을 삭제
+//					if (errorFileList != null && !errorFileList.isEmpty()) {
+//						for (File errorFile : errorFileList) {
+//							//GagaFileUtil.deleteFile(errorFile.getPath());
+//						}
+//					}
+//
+//					throw new IllegalStateException("상품이미지 파일의 크기(" + width + "*" + height + ")가 맞지 않습니다. (올바른 크기: 1079*1499, 750*1041, 1000*1000)");
+//				}
+
+				goodsImg.setDispOrd(index++);
+				goodsImg.setOrgImgNm(GagaFileUtil.getConcatenationPath(brandDir,newFile.getName()));
+				goodsImg.setSysImgNm(GagaFileUtil.getConcatenationPath(brandDir,newFile.getName()));
+			} else {
+				goodsImg.setOrgImgNm(GagaFileUtil.getConcatenationPath(goodsImg.getSysImgUrl() ,goodsImg.getSysImgNm()));
+				goodsImg.setSysImgNm(GagaFileUtil.getConcatenationPath(goodsImg.getSysImgUrl() ,goodsImg.getSysImgNm()));
+				goodsImg.setDispOrd(index++);
+			}
+		}
+
+		// 2.dx5에서 삭제한 파일 실제 삭제 처리
+		for (GoodsImg goodsImg : goodsImgList) {
+			if (goodsImg.getMode().equals("D")) {
+				log.info("Original file to delete: {}", GagaFileUtil.getConcatenationPath(goodsUploadPath, goodsImg.getSysImgUrl(), goodsImg.getSysImgNm()));
+
+				// 상품이미지 삭제
+				GagaFileUtil.deleteFile(GagaFileUtil.getConcatenationPath(goodsUploadPath, goodsImg.getSysImgUrl(), goodsImg.getSysImgNm()));
+
+				// 리사이징된 상품이미지 삭제
+//				StyleImageUtils.deleteResizedGoodsImage(goodsUploadPath, goodsImg.getSysImgNm());
+			}
+		}
+
+		log.info("[saveGoodsThumbnailImageList] goodsImgList222 = {}", goodsImgList);
+
+		// 상품이미지 저장 처리
+		goodsService.saveGoodsImageList(goodsImgList);
+
+		return super.ok(message.getMessage("SUCC_0007"));
+	}
+
 	/**
 	 * 세트상품구성 화면
 	 *

style24.admin/src/main/java/com/style24/persistence/domain/Brand.java

@@ -39,6 +39,7 @@ public class Brand extends TscBaseDomain {
 	private String distributionGb;	// 유통구분(공통코드 G065)
 	private int dispOrd;			// 표시순서
 	private String useYn;			// 사용여부(Y:사용)
+	private int brandNo;			// 브랜드번호
 
 	private String newSysFileNm;	//신규이미지파일명
 

style24.admin/src/main/java/com/style24/persistence/domain/Goods.java

@@ -74,6 +74,7 @@ public class Goods extends TscBaseDomain {
 
 	private String brandEnm;		//브랜드영문명
 	private String brandGrpNm;		//브랜드그룹명
+	private int brandNo;			// 브랜드번호
 
 	private String goodsDesc;
 	private String goodsPcTopDesc;

style24.admin/src/main/java/com/style24/persistence/domain/GoodsImg.java

@@ -53,6 +53,7 @@ public class GoodsImg extends TscBaseDomain {
 	private String colorNm;
 	private String mode;
 	private int defaultImgOrd;
-
+	private String sysImgUrl;
+	private int brandNo;
 
 }

style24.admin/src/main/java/com/style24/persistence/mybatis/shop/TsaGoods.xml

@@ -853,6 +853,7 @@
 		     , G.GOODS_SNM1
 		     , G.BRAND_CD
 		     , B.BRAND_GRP_NM
+		     , B.BRAND_NO
 		     , G.ITEMKIND_CD
 		     , G.STYLE_YEAR
 		     , G.SEASON_CD
@@ -3530,13 +3531,58 @@
 		SELECT GOODS_CD
 		     , COLOR_CD
 		     , DISP_ORD
-		     , ORG_IMG_NM
-		     , SYS_IMG_NM
+		     , ORG_IMG_NM /* S0001/20201221/14505664_L.jpg */
+		     , SUBSTRING_INDEX(SYS_IMG_NM , '/', -1) AS SYS_IMG_NM
+		     , SUBSTRING_INDEX(SYS_IMG_NM , '/', 2) AS SYS_IMG_URL
 		     , DEFAULT_IMG_YN
 		FROM   TB_GOODS_IMG_DX5
 		WHERE  GOODS_CD = #{goodsCd}
 		AND    COLOR_CD = #{colorCd}
 		ORDER  BY DISP_ORD
 	</select>
+	
+	<!-- 상품이미지 전체 삭제 -->
+	<delete id="deleteGoodsImageTotal" parameterType="GoodsImg">
+		/* TsaGoods.deleteGoodsImageTotal */
+		DELETE
+		FROM TB_GOODS_IMG_DX5
+		WHERE GOODS_CD = #{goodsCd}
+		AND COLOR_CD = #{colorCd}
+	</delete>
+
+	<!-- 상품이미지 삭제 -->
+	<delete id="deleteGoodsImage" parameterType="GoodsImg">
+		/* TsaGoods.deleteGoodsImage */
+		DELETE
+		FROM TB_GOODS_IMG_DX5
+		WHERE GOODS_CD = #{goodsCd}
+		AND COLOR_CD = #{colorCd}
+		AND DISP_ORD = #{dispOrd}
+	</delete>
+
+	<!-- 상품이미지 등록 -->
+	<insert id="createGoodsImage" parameterType="GoodsImg">
+		/* TsaGoods.createGoodsImage */
+		INSERT INTO TB_GOODS_IMG_DX5 (
+		       GOODS_CD
+		     , COLOR_CD
+		     , DISP_ORD
+		     , ORG_IMG_NM
+		     , SYS_IMG_NM
+		     , DEFAULT_IMG_YN
+		     , REG_NO
+		     , REG_DT
+		)
+		VALUES (
+		       #{goodsCd}
+		     , #{colorCd}
+		     , #{dispOrd}
+		     , #{orgImgNm}
+		     , #{sysImgNm}
+		     , #{defaultImgYn}
+		     , #{regNo}
+		     , NOW()
+		)
+	</insert>
 	
 </mapper>

style24.admin/src/main/resources/config/application-locd.yml

@@ -30,22 +30,22 @@ upload:
         allow.extension: jpg|gif|jpeg|png|bmp|txt|doc|docx|ppt|pptx|xls|xlsx|hwp|pdf
         view: //ldimage.style24.com
     goods:
-        target.path: /WIDE/workspace/files/data/style24
+        target.path: /WIDE/workspace/files/data/style24/Upload/ProductImage
         max.size: 10
-        allow.extension: jpg|gif|jpeg|png
-        view: //image.style24.com/goods
+        allow.extension: jpg|gif|jpeg
+        view: //ldimage.style24.com/Upload/ProductImage
     image:
         target.path: /WIDE/workspace/files/data/style24
         max.size: 10
         allow.extension: jpg|gif|jpeg|png
         view: //ldimage.style24.com
     excel:
-        target.path: /WIDE/workspace/files/data/style24
+        target.path: /WIDE/workspace/files/data/style24/excel
         max.size: 10
         allow.extension: xls|xlsx
         view: //ldimage.style24.com/excel
     sample:
-        target.path: /WIDE/workspace/files/data/style24
+        target.path: /WIDE/workspace/files/data/style24/sample
         max.size: 10
         allow.extension: txt|doc|docx|ppt|pptx|xls|xlsx|hwp|pdf
         view: //ldimage.style24.com/sample

style24.admin/src/main/resources/config/application-locp.yml

@@ -25,30 +25,30 @@ domain:
 upload:
     dext.target.path: /WIDE/workspace/files/data/style24/dext
     default:
-        target.path: /WIDE/workspace/files/data
+        target.path: /WIDE/workspace/files/data/style24
         max.size: 10
         allow.extension: jpg|gif|jpeg|png|bmp|txt|doc|docx|ppt|pptx|xls|xlsx|hwp|pdf
-        view: //image.wivismall.com/speedy_image-wivismall
+        view: //lpimage.style24.com
     goods:
-        target.path: /WIDE/workspace/files/data
+        target.path: /WIDE/workspace/files/data/style24/Upload/ProductImage
         max.size: 10
         allow.extension: jpg|gif|jpeg|png
-        view: //image.wivismall.com/speedy_image-wivismall/goods
+        view: //lpimage.style24.com/Upload/ProductImage
     image:
-        target.path: /WIDE/workspace/files/data
+        target.path: /WIDE/workspace/files/data/style24
         max.size: 10
         allow.extension: jpg|gif|jpeg|png
-        view: //image.wivismall.com/speedy_image-wivismall
+        view: //lpimage.style24.com
     excel:
-        target.path: /WIDE/workspace/files/data
+        target.path: /WIDE/workspace/files/data/style24/excel
         max.size: 10
         allow.extension: xls|xlsx
-        view: //locp.image.wivismall.com/data/excel
+        view: //lpimage.style24.com/excel
     sample:
-        target.path: /WIDE/workspace/files/data
+        target.path: /WIDE/workspace/files/data/style24/sample
         max.size: 10
         allow.extension: txt|doc|docx|ppt|pptx|xls|xlsx|hwp|pdf
-        view: //locp.image.wivismall.com/data/sample
+        view: //lpimage.style24.com/sample
 
 download.path: /WIDE/workspace/files/data
 

style24.admin/src/main/webapp/WEB-INF/views/common/fragments/variables.html

@@ -24,6 +24,7 @@ var _uximgUrl = [[${@environment.getProperty('domain.uximage')}]];
 var _imgUrl = [[${@environment.getProperty('domain.image')}]];
 var _sampleUrl = [[${@environment.getProperty('upload.sample.view')}]];
 var _uploadDefaultUrl = [[${@environment.getProperty('upload.default.view')}]];
+var _goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];
 
 var _today = [[${#calendars.format(#calendars.createNow(), 'yyyy-MM-dd')}]];
 var _thisYear = [[${#calendars.format(#calendars.createNow(), 'yyyy')}]];

style24.admin/src/main/webapp/WEB-INF/views/goods/GoodsDetailSizeStockForm.html

@@ -47,10 +47,12 @@
 				</th:block>
 				<input type="hidden" name="sysImgNmOrg" id="sysImgNmOrg" th:value="${goodsColor.sysImgNm}"/>
 			</td>	
-			<td class="aC" th:text="${goodsColor.optCd1}">BK
+			<td class="aC" ><th:block th:text="${goodsColor.optCd1}">BK</th:block> 
 				<input type="hidden" name="colorCd" id="colorCd" th:value="${goodsColor.optCd1}"/>
 			</td>
-			<td class="aC" th:text="${goodsColor.colorEnm}">BLACK</td>
+			<td class="aC" ><th:block th:text="${goodsColor.colorEnm}">BLACK</th:block>  
+				<input type="hidden" name="colorNm" id="colorNm" th:value="${goodsColor.colorEnm}"/>
+			</td>
 			<td><button type="button" class="btn btn-base btn-lg" onclick="fnGoodsDetailImg(this)" th:text="${#strings.isEmpty(goodsColor.imgPath1) ?'등록':'수정'}">등록</button></td>
 		</tr>
 		</th:block>
@@ -144,16 +146,13 @@
 		var mode= 'U';
 		var goodsCd = $('#goodsDetailForm input[name=goodsCd]').val();
 		var colorCd = $(obj).parent().parent().find("input[name=colorCd]").val();
+		var colorNm = $(obj).parent().parent().find("input[name=colorNm]").val();
 		
 		if (gagajf.isNull($(obj).parent().parent().find("input[name=sysImgNmOrg]").val())){
 			mode = "C";
 		}
 		
-		if ("Y" == $('#goodsDetailForm input[name=selfGoodsYn]').val()){
-			cfnOpenGoodsImageMassPopup(goodsCd, colorCd, colorNm, mode);
-		}else{
-			cfnOpenGoodsImagePopup($('#goodsDetailForm input[name=goodsCd]').val());	
-		}
+		cfnOpenGoodsImageMassPopup(goodsCd, colorCd, colorNm, mode);
 		
 	}
 	$(document).ready(function() {

style24.admin/src/main/webapp/WEB-INF/views/goods/GoodsImageMassForm.html

@@ -14,12 +14,12 @@
  * 1.0  2020.11.27   eskim       최초 작성
  *******************************************************************************
  -->
-	<div class="modalPopup" >
+	<div class="modalPopup" data-width="1280">
 		<!-- PANELSTYLE -->
 			<div class="panelStyle">
 				<!-- TITLE -->
 				<div class="panelTitle">
-					<h2>상품 이미지 <th:block th:text="${goodsImg.mode =='U'}? '상세':'등록'"></th:block></h2>
+					<h2>상품 이미지 <th:block th:text="${goodsImg.mode =='U'}? '상세':'등록'"></th:block>&nbsp;<button type="button" class="btn icn" onclick="fnOpenCommentPopup('comment')" ><i class="fa fa-cog" aria-hidden="true"></i></button></h2>
 					<button type="button" class="close" onclick="fnGoodsImgFormClose()"><i class="fa fa-times"></i></button>
 				</div>
 				<!-- //TITLE -->
@@ -38,26 +38,23 @@
 					</ul>
 					<table class="frmStyle">
 						<colgroup>
-							<col width="100px"/>
-							<col/>
-							<col width="100px"/>
-							<col/>
-							<col width="100px"/>
-							<col/>
-							<col width="100px"/>
+							<col width="7%"/>
+							<col width="25%"/>
+							<col width="8%"/>
+							<col width="10%"/>
+							<col width="8%"/>
+							<col width="10%"/>
+							<col width="8%"/>
 							<col/>
 						</colgroup>
 						<tr>
 							<th>상품코드</th>
 							<td th:text="${goodsImg.goodsCd}">14373767</td>
 							<th>컬러명</th>
-							<td th:text="${goodsImg.goodsNm}">PINK</td>
+							<td th:text="${goodsImg.colorNm}">PINK</td>
 							<th>대표 이미지순번</th>
 							<td><input type="text" class="text-right" name="defaultImgOrd" maxlength="3" th:value="${defaultImgOrd}" required="required" data-valid-type="number" data-valid-name="대표이미지순번"/></td>
 							<td colspan="2"></td>
-							<!-- 
-							<th>마우스오버 이미지순번</th>
-							<td><input type="text" value="2"/></td> -->
 						</tr>
 						<tr>
 							<th>이미지등록</th>
@@ -65,376 +62,28 @@
 
 								<!-- 덱스터 테이블 영역 -->
 								<ul class="dexterTable">
-									<li class="dexterNo">
+									<li class="dexterNo" id="dx5Index">
 										<!-- 덱스터 테이블 번호 -->
-										<div>1</div><div>2</div><div>3</div><div>4</div>
 										<!-- //덱스터 테이블 번호 -->
 									</li>
 									<li>
 									<!-- 덱스터 테이블 삽입 -->
-										덱스터 테이블 삽입<br/>공간은 테이블 넓이에 따라 자동으로 넓어집니다.<br/>
-										(최소 넓이 : 350px로 설정됨)<br/>
+										<!-- 덱스터 테이블 삽입<br/>공간은 테이블 넓이에 따라 자동으로 넓어집니다.<br/>
+										(최소 넓이 : 350px로 설정됨)<br/> -->
+										<div id="dext5-container" style="width: 100%; height: 450px;"></div>
 									<!-- //덱스터 테이블 -->
 									<li>
 								</ul>
 								<!-- //덱스터 테이블 영역 -->
 
 							</td>
-							<td colspan="4" class="verticalTop">
+							<td colspan="6" class="verticalTop">
 
 								<!-- 이미지 카드 영역 -->
-								<div class="cardArea">
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
+								<div class="cardArea" id="dx5CardArea">
 									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
-									<!-- 이미지 카드 -->
-									<div class="imgCard">
-										<button type="button" class="cardClose">닫기</button>
-										<ul>
-											<li>
-												<img src="http://image.istyle24.com/Upload/ProductImage/0000004766/20200826/14505664_L.jpg?RS=560" widht="70" height="70">
-											</li>
-											<li>이미지1</li>
-										</ul>
-										<p>G2019052800040_023_4(170330).jpg</p>
-									</div>
-									<!-- //이미지 카드 -->
 								</div>
 								<!-- //이미지 카드 영역 -->
-
 							</td>
 						</tr>
 					</table>
@@ -455,23 +104,153 @@
 				<!-- //버튼 배치 영역 -->
 			</div>
 	</div>
-<script type="text/javascript" src="/dx5/dextuploadx5-configuration.js?v=2020121801"></script>
-<script type="text/javascript" src="/dx5/dextuploadx5.js?v=2020121801"></script>
-<script type="text/javascript" src="/ux/plugins/gaga/gaga.dx5.js?2020121801"></script>
+<script type="text/javascript" src="/dx5/dextuploadx5-configuration.js?v=2020122101"></script>
+<script type="text/javascript" src="/dx5/dextuploadx5.js?v=2020122101"></script>
+<script type="text/javascript" src="/ux/plugins/gaga/gaga.dx5.js?2020122101"></script>
 <script th:inline="javascript">
 /*<![CDATA[*/
+	
+	var goodsImgList = [[${goodsImgList}]];
+	
+	//--------------------------------------------------------------------------
+	// Dextupload X5 이벤트 Start
+	//--------------------------------------------------------------------------
+	// Dextupload X5 생성
+	gagaDx5.createDX5("dext5", "btnAddFiles", _goodsUrl, "goods");
+
+	// Dextupload X5 생성 후 호출되는 이벤트
+	var onDX5Created = function(id) {
+		var actionUrl = '/dext/files/upload/goods';
+		gagaDx5.onDX5Created(actionUrl, goodsImgList);
+	}
+
+	// Dextupload X5 에러 시 호출되는 이벤트
+	var onDX5Error = function(id, code, msg) {
+		mcxDialog.alert(id + " => " +  code + "\n" + msg);
+	}
+
+	// Dextupload X5 업로드 성공 시 호출되는 이벤트
+	var onDX5UploadCompleted = function(id) {
+		gagaDx5.uploadAfterProcess();
+	}
+
+	// Dextupload X5 이미지 등록이 완료된 후 호출되는 이벤트
+	var onDX5ItemsAdded = function(id, count) {
+		gagaDx5.resortDX5FileList();
+	}
+	//--------------------------------------------------------------------------
+	// Dextupload X5 이벤트 End
+	//--------------------------------------------------------------------------
+	
+	// 업로드 후처리. 반드시 구현해야 함. (gaga.dx5.js 파일에서 호출됨)
+	var fnUploadAfterProcess = function(id, result) {
+// 		if (typeof(result) != 'undefined') {
+// 			if (!gagajf.isNull(result.error.message)) {
+// 				gagaAlert.alert(result.error.message);
+// 				return;
+// 			}
+// 		}
+
+		console.log(result);
+
+		var dx = dx5.get(id);
+
+		var updatedData = [];
+
+		// 삭제한 파일 설정
+		var deleteFiles = dx.getRemovedFiles();
+		if (deleteFiles.length > 0) {
+			$.each(deleteFiles, function(idx, item) {
+				var params = new Object();
+				params.mode = 'D';
+				params.goodsCd = $('#goodsImgForm input[name=goodsCd]').val();
+				params.colorCd = $('#goodsImgForm input[name=colorCd]').val();
+				params.dispOrd = idx + 1;
+				params.orgImgNm = item.name;
+				params.sysImgNm = item.name;
+				params.sysImgUrl = item.url;
+				params.defaultImgYn = 'N';
+				updatedData.push(params);
+			});
+		}
+
+		// 업로드한 파일 및 순서 변경한 파일 설정
+		var totCnt = dx.getTotalItemCount();
+		if (totCnt > 0) {
+			for (var i = 0; i < totCnt; i++) {
+				var item = dx.getItemByIndex(i);
+
+				var params = new Object();
+				params.mode = (item.type == 'FILE') ? 'C' : '';
+				params.goodsCd = $('#goodsImgForm input[name=goodsCd]').val();
+				params.colorCd = $('#goodsImgForm input[name=colorCd]').val();
+				params.dispOrd = i + 1;
+				params.orgImgNm = item.name;
+				params.sysImgNm = item.name;
+				params.sysImgUrl = item.url;
+				params.defaultImgYn = ($('#goodsImgForm input[name=defaultImgOrd]').val() == (i + 1)) ? 'Y' : 'N';
+				updatedData.push(params);
+			}
+		}
+
+		var jsonData = JSON.stringify(updatedData);
+		console.log(jsonData);
+
+		gagajf.ajaxJsonSubmit('/goods/thumbnail/image/save', jsonData, fnUploadCallback);
+	}
+
+	// 콜백함수
+	var fnUploadCallback = function(result) {
+		// 기본이미지명 조회
+		//var actionUrl = '/goods/default/image/url'
+		//		+ '?goodsCd=' + $('#goodsImgForm input[name=goodsCd]').val()
+		//		+ '&colorCd=' + $('#goodsImgForm input[name=colorCd]').val();
+
+		//$.get(actionUrl
+		//	, function(url) {
+		//		console.log(url);
+		//		//opener.setImg($('#goodsImgForm input[name=defaultImgOrd]').val(), result.defaultImgNm);
+		//		fnGoodsImgFormClose();
+		//	});
+		fnGoodsImgFormClose();
+	}
+
+	// 더블클릭시 썸네일 지정 후 첫번째로 이동
+	function onDX5ItemDoubleClick(id, itemIndex, itemId, itemType) {
+		var dx = dx5.get(id);
+		var gubun = $("#gubun").val();
+
+		gagaAlert.confirm('선택하신 이미지를 대표이미지로 선택하시겠습니까?', function() {
+			firstMoveUp(itemIndex);
+			return false;
+		});
+	}
+
+	// 선택 항목을 첫번째로 이동
+	function firstMoveUp(selIndex){
+		ti = parseInt(selIndex, 10);
+		for(var i = ti; i > 0; i--) {
+			dx5.get("dext5").moveItemUp(i);
+		}
+	}
 
 	//창종료
 	var fnGoodsImgFormClose = function(){
+		$('.dx5-pop-up').remove();
+		$('.dx5-pop-dn').remove();
+		$('.dx5-pop-pv').remove();
+		$('.dx5-pop-cp').remove();
+		$('.dx5-pop-ud').remove();
 		uifnPopupClose('popupGoodsImageMass');
 	}
 
 	//안내팝업
 	var fnOpenCommentPopup = function(id) {
-		var str = '<div class="popupWrap" id="'+id+'" style="z-index:30">';
-		str = str + '<div class="popup modeless ui-widget-content ui-draggable ui-draggable-handle" style="display: block;  position: relative;">';
-		str = str + '<button type="button" class="close" onclick="uifnPopClose(\''+id+'\')"><i class="fa fa-times"></i></button>';
-		str = str + '<div class="mdPopContent">';
+		var str = '<div class="popupWrap"  id="'+id+'" style="z-index:30">';
+		str = str + '<div class="modalPopup" data-width="500">';
+		str = str + '<div class="panelStyle">';
+		str = str + '<div class="panelTitle"><button type="button" class="close" onclick="uifnPopupClose(\''+id+'\')"><i class="fa fa-times"></i></button></div>';
+		str = str + '<div class="panelContent">';
 		str = str + '<ul class="notice ">';
 		str = str + '<em><b>* 이미지 타입</b></em>';
 		str = str + '<li> <b>A</b> : <b>자사전용</b>(이미지 도메인명 없음)</li>';
@@ -485,13 +264,15 @@
 		str = str + '<li><b>IMG_PATH26 ~ IMG_PATH27</b> (선택, 라벨컷) : 상품코드_<b>R1</b>.jpg ~ 상품코드_<b>R2</b>.jpg</li>';
 		str = str + '<li><b>IMG_PATH28 ~ IMG_PATH30</b> (선택, 기타컷) : 상품코드_<b>E1</b>.jpg ~ 상품코드_<b>E3</b>.jpg</li>';
 		str = str + '</ul>';
-		str = str + '</div></div></div>';
+		str = str + '</div></div></div></div>';
 
 		if ($('#'+ id).length == 0) {
 			$('body').append(str);
 		}
-		$("#"+id).css({display:"block"});
+		uifnPopupOpen(id);
+		//$("#"+id).css({display:"block"});
 	}
+	
 /*]]>*/
 </script>
 </html>

style24.admin/src/main/webapp/ux/plugins/gaga/gaga.dx5.js

@@ -102,11 +102,11 @@ var gagaDx5 = {
 		
 		// 기존 업로드된 파일을 dx5에 그리기
 		$.each(imgList, function(idx, item) {
-			if (item.extmallImgYn == 'Y'){	//외부몰이미지구분용
-				dx.addVirtualFile({ vindex : item.sysImgNm, name : item.sysImgNm, size : 20000});
-			}else{
-				dx.addVirtualFile({ vindex : item.sysImgNm, name : item.sysImgNm, size : 10000});
-			}
+			//if (item.extmallImgYn == 'Y'){	//외부몰이미지구분용
+			//	dx.addVirtualFile({ vindex : item.sysImgNm, name : item.sysImgNm, size : 20000});
+			//}else{
+				dx.addVirtualFile({ vindex : item.sysImgNm, name : item.sysImgNm, size : 10000, url : item.sysImgUrl});
+			//}
 		});
 		
 		// 이미지 항목 높이 조절
@@ -255,68 +255,70 @@ var gagaDx5 = {
 				continue;
 			}
 			if (dxProdGbn =="goods"){
-				if (item.size > 10000){
-					tag += '<div class="imgCard"  style="border:2px solid #8597eb">\n';	
-				}else{
-					tag += '<div class="imgCard">\n';
-				}
-				tag += '	<button type="button" class="cardClose" onclick="gagaDx5.deletePreviewImage(\'' + i + '\');">닫기</button>\n';
-				tag += '	<ul>\n';
-				tag += '		<li>\n';
-				if (item.size > 10000){
-					tag += '			<img src="' + previewUrl + '/upload/goods/type5/' + item.name + '" width="70" height="70"/>\n';
-				}else{
-					tag += '			<img src="' + previewUrl + '/upload/goods/type4/' + item.name + '" width="70" height="70"/>\n';
-				}
-				tag += '		</li>\n';
-				tag += '		<li>이미지' + (i + 1) + '</li>\n';
-				tag += '	</ul>\n';
-				tag += '	<p>' + item.name + '</p>\n';
-				tag += '</div>\n';
-			}else if (dxProdGbn =="magazine"){
 				tag += '<div class="imgCard">\n';
+				//if (item.size > 10000){
+				//	tag += '<div class="imgCard"  style="border:2px solid #8597eb">\n';	
+				//}else{
+				//	tag += '<div class="imgCard">\n';
+				//}
 				tag += '	<button type="button" class="cardClose" onclick="gagaDx5.deletePreviewImage(\'' + i + '\');">닫기</button>\n';
 				tag += '	<ul>\n';
 				tag += '		<li>\n';
-				tag += '			<img src="' + previewUrl + '/upload/michaa/magazine/' + item.name + '" width="70" height="70"/>\n';
+				tag += '			<img src="' + previewUrl + '/' + item.url + '/' + item.name + '" width="70" height="70"/>\n';
+				//if (item.size > 10000){
+				//	tag += '			<img src="' + previewUrl + '/upload/goods/type5/' + item.name + '" width="70" height="70"/>\n';
+				//}else{
+				//	tag += '			<img src="' + previewUrl + '/upload/goods/type4/' + item.name + '" width="70" height="70"/>\n';
+				//}
 				tag += '		</li>\n';
 				tag += '		<li>이미지' + (i + 1) + '</li>\n';
 				tag += '	</ul>\n';
 				tag += '	<p>' + item.name + '</p>\n';
 				tag += '</div>\n';
+			//}else if (dxProdGbn =="magazine"){
+			//	tag += '<div class="imgCard">\n';
+			//	tag += '	<button type="button" class="cardClose" onclick="gagaDx5.deletePreviewImage(\'' + i + '\');">닫기</button>\n';
+			//	tag += '	<ul>\n';
+			//	tag += '		<li>\n';
+			//	tag += '			<img src="' + previewUrl + '/upload/michaa/magazine/' + item.name + '" width="70" height="70"/>\n';
+			//	tag += '		</li>\n';
+			//	tag += '		<li>이미지' + (i + 1) + '</li>\n';
+			//	tag += '	</ul>\n';
+			//	tag += '	<p>' + item.name + '</p>\n';
+			//	tag += '</div>\n';
 			}else if (dxProdGbn =="lookbook"){
 				tag += '<div class="imgCard">\n';
 				tag += '	<button type="button" class="cardClose" onclick="gagaDx5.deletePreviewImage(\'' + i + '\');">닫기</button>\n';
 				tag += '	<ul>\n';
 				tag += '		<li>\n';
-				tag += '			<img src="' + previewUrl + '/upload/lookbook/' + item.name + '" width="70" height="70"/>\n';
+				tag += '			<img src="' + previewUrl + '/lookbook/' + item.name + '" width="70" height="70"/>\n';
 				tag += '		</li>\n';
 				tag += '		<li>이미지' + (i + 1) + '</li>\n';
 				tag += '	</ul>\n';
 				tag += '	<p>' + item.name + '</p>\n';
 				tag += '</div>\n';	
-			}else if (dxProdGbn =="collection"){
-				tag += '<div class="imgCard">\n';
-				tag += '	<button type="button" class="cardClose" onclick="gagaDx5.deletePreviewImage(\'' + i + '\');">닫기</button>\n';
-				tag += '	<ul>\n';
-				tag += '		<li>\n';
-				tag += '			<img src="' + previewUrl + '/upload/michaa/collection/COLLECTION_AD/' + item.name + '" width="70" height="70"/>\n';
-				tag += '		</li>\n';
-				tag += '		<li>이미지' + (i + 1) + '</li>\n';
-				tag += '	</ul>\n';
-				tag += '	<p>' + item.name + '</p>\n';
-				tag += '</div>\n';
-			}else if (dxProdGbn =="mdlookbook"){
-				tag += '<div class="imgCard">\n';
-				tag += '	<button type="button" class="cardClose" onclick="gagaDx5.deletePreviewImage(\'' + i + '\');">닫기</button>\n';
-				tag += '	<ul>\n';
-				tag += '		<li>\n';
-				tag += '			<img src="' + previewUrl + '/michaa/campaign/md/' + item.name + '" width="70" height="70"/>\n';
-				tag += '		</li>\n';
-				tag += '		<li>이미지' + (i + 1) + '</li>\n';
-				tag += '	</ul>\n';
-				tag += '	<p>' + item.name + '</p>\n';
-				tag += '</div>\n';		
+			//}else if (dxProdGbn =="collection"){
+			//	tag += '<div class="imgCard">\n';
+			//	tag += '	<button type="button" class="cardClose" onclick="gagaDx5.deletePreviewImage(\'' + i + '\');">닫기</button>\n';
+			//	tag += '	<ul>\n';
+			//	tag += '		<li>\n';
+			//	tag += '			<img src="' + previewUrl + '/upload/michaa/collection/COLLECTION_AD/' + item.name + '" width="70" height="70"/>\n';
+			//	tag += '		</li>\n';
+			//	tag += '		<li>이미지' + (i + 1) + '</li>\n';
+			//	tag += '	</ul>\n';
+			//	tag += '	<p>' + item.name + '</p>\n';
+			//	tag += '</div>\n';
+			//}else if (dxProdGbn =="mdlookbook"){
+			//	tag += '<div class="imgCard">\n';
+			//	tag += '	<button type="button" class="cardClose" onclick="gagaDx5.deletePreviewImage(\'' + i + '\');">닫기</button>\n';
+			//	tag += '	<ul>\n';
+			//	tag += '		<li>\n';
+			//	tag += '			<img src="' + previewUrl + '/michaa/campaign/md/' + item.name + '" width="70" height="70"/>\n';
+			//	tag += '		</li>\n';
+			//	tag += '		<li>이미지' + (i + 1) + '</li>\n';
+			//	tag += '	</ul>\n';
+			//	tag += '	<p>' + item.name + '</p>\n';
+			//	tag += '</div>\n';		
 			}
 		}
 		

style24.core/src/main/java/com/style24/core/support/util/StyleImageUtils.java

@@ -0,0 +1,279 @@
+package com.style24.core.support.util;
+
+import java.awt.Image;
+import java.awt.image.BufferedImage;
+import java.awt.image.PixelGrabber;
+import java.io.File;
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.List;
+import java.util.StringTokenizer;
+
+import javax.annotation.PostConstruct;
+import javax.imageio.ImageIO;
+import javax.swing.ImageIcon;
+
+import org.springframework.stereotype.Component;
+
+import lombok.extern.slf4j.Slf4j;
+
+import com.gagaframework.web.util.GagaFileUtil;
+
+@Component
+@Slf4j
+public class StyleImageUtils {
+
+	public static final int RATIO = 0;
+	public static final int SAME = -1;
+
+	private static String resizeSizes;
+
+//	@Value("${goods.thumnbnail.image.size}")
+//	private String goodsSizes;
+
+	@PostConstruct
+	public void init() {
+		StyleImageUtils.resizeSizes = null; //this.goodsSizes;
+	}
+
+//	/**
+//	 * 웹에디터 썸네일
+//	 * @param src 			원본소스 이미지 파일
+//	 * @param dest			제작할 이미지 파일
+//	 * @param width			썸네일 가로크기
+//	 * @param height		썸네일 세로크기
+//	 * @throws IOException	파일입출력 예외사항
+//	 */
+//	public static void thumbnail(File src, File dest, int width) throws IOException {
+//		Image srcImg = getImageObject(src);
+//		int srcWidth = srcImg.getWidth(null);
+//
+//		if (srcWidth > width) {
+//			log.debug("resize 처리: {}", src);
+//			GagaFileUtil.copyFile(src, dest);
+//			resize(src, src, width, RATIO);
+//		}
+//	}
+//
+//	public static void thumbnailArticle(File src, File dest, int width, String targetfolder) throws IOException {
+//		Image srcImg = getImageObject(src);
+//		int srcWidth = srcImg.getWidth(null);
+//
+//		if (srcWidth > width) {
+//			log.debug("resize 처리한다: {}", src);
+//
+//			if (!targetfolder.equals("")) {
+//				File newfolder = new File(targetfolder);
+//				if (!newfolder.exists() || !newfolder.isDirectory())
+//					newfolder.mkdirs();
+//			}
+//
+//			GagaFileUtil.copyFile(src, dest);
+//			resize(src, src, width, RATIO);
+//		}
+//	}
+
+	public static Image getImageObject(File f) throws IOException {
+		Image objImg = null;
+		String suffix = f.getName().substring(f.getName().lastIndexOf('.') + 1).toLowerCase();
+
+		if (suffix.equals("bmp") || suffix.equals("png") || suffix.equals("gif") || suffix.equals("jpg")) {
+			objImg = ImageIO.read(f);
+		} else {
+			// ImageIcon을 활용해서 Image 생성
+			// 이렇게 하는 이유는 getScaledInstance를 통해 구한 이미지를
+			// PixelGrabber.grabPixels로 리사이즈 할 때 빠르게 처리하기 위함이다.
+			objImg = new ImageIcon(f.toURI().toURL()).getImage();
+		}
+
+		return objImg;
+	}
+
+	/**
+	 * 상품이미지 리사이징
+	 * @param path - 경로
+	 * @param filename - 파일명
+	 * @return 리사이징된 파일 목록
+	 * @throws IOException
+	 * @author gagamel
+	 * @since 2019. 6. 28
+	 */
+	public static List<File> resizeGoodsImage(String path, String filename) throws IOException {
+		List<File> fileList = new ArrayList<File>();
+
+		// 리사이즈할 상품이미지 사이즈
+		StringTokenizer goodsSizes = new StringTokenizer(resizeSizes, ",");
+		log.debug("Size count to resize: {}", goodsSizes.countTokens());
+
+		int index = 0;
+
+		while (goodsSizes.hasMoreTokens()) {
+			String goodsSize = goodsSizes.nextToken();
+			log.debug("goodsSize: {}", goodsSize);
+
+			String[] arrProdSize = goodsSize.split("-");
+			int width = Integer.parseInt(arrProdSize[0]);
+			int height = Integer.parseInt(arrProdSize[1]);
+
+			File resizeFile = new File(GagaFileUtil.getConcatenationPath(path, "type" + (index++ + 2), filename));
+			fileList.add(resizeFile);
+
+			thumbnail(new File(GagaFileUtil.getConcatenationPath(path, filename))
+					, resizeFile, height, width);
+		}
+
+		return fileList;
+	}
+
+	/**
+	 * 리사이징된 상품이미지 삭제
+	 * @param path - 경로
+	 * @param filename - 파일명
+	 * @throws IOException
+	 * @author gagamel
+	 * @since 2019. 7. 1
+	 */
+	public static void deleteResizedGoodsImage(String path, String filename) throws IOException {
+		// 리사이즈된 상품이미지 사이즈
+		StringTokenizer goodsSizes = new StringTokenizer(resizeSizes, ",");
+
+		int index = 0;
+
+		while (goodsSizes.hasMoreTokens()) {
+			goodsSizes.nextToken();
+			log.debug("Resized file to delete: {}", GagaFileUtil.getConcatenationPath(path, "type" + (index++ + 2), filename));
+			GagaFileUtil.deleteFile(GagaFileUtil.getConcatenationPath(path, "type" + (index++ + 2), filename));
+		}
+	}
+
+	/**
+	 * 이미지 리사이즈, 주로 썸네일 제작에 사용
+	 * @param src 			원본소스 이미지 파일
+	 * @param dest			제작할 이미지 파일
+	 * @param width			썸네일 가로크기
+	 * @param height		썸네일 세로크기
+	 * @throws IOException	파일입출력 예외사항
+	 */
+	public static void thumbnail(File src, File dest, int height, int width) throws IOException {
+		Image srcImg = getImageObject(src);
+		int srcWidth = srcImg.getWidth(null);
+		int srcHeight = srcImg.getHeight(null);
+
+		if (srcWidth > width || srcHeight > height) {
+			if (srcWidth > srcHeight) {
+				height = RATIO;
+			} else if (srcWidth < srcHeight) {
+				//width = RATIO;
+			} else {
+				if (width > height) {
+					width = RATIO;
+				} else {
+					height = RATIO;
+				}
+			}
+		} else {
+			width = SAME;
+			height = SAME;
+		}
+
+		resize(src, dest, width, height);
+	}
+
+
+	/**
+	 * 이미지 리사이즈, 주로 썸네일 제작에 사용
+	 * @param src 			원본소스 이미지 파일
+	 * @param dest			제작할 이미지 파일
+	 * @param width			이미지 가로크기(변경할 크기 or RATIO or SAME)
+	 * @param height		이미지 세로크기(변경할 크기 or RATIO or SAME)
+	 * @throws IOException	파일입출력 예외사항
+	 */
+	public static void resize(File src, File dest, int width, int height) throws IOException {
+		Image srcImg = getImageObject(src);
+		int srcWidth = srcImg.getWidth(null);
+		int srcHeight = srcImg.getHeight(null);
+
+		int destWidth = -1, destHeight = -1;
+
+		if (width == SAME) {
+			destWidth = srcWidth;
+		} else if (width > 0) {
+			destWidth = width;
+		}
+
+		if (height == SAME) {
+			destHeight = srcHeight;
+		} else if (height > 0) {
+			destHeight = height;
+		}
+
+//		if (width == RATIO && height == RATIO) {
+//			destWidth = srcWidth;
+//			destHeight = srcHeight;
+//		} else if (width == RATIO) {
+//			double ratio = ((double)destHeight) / ((double)srcHeight);
+//			destWidth = (int)((double)srcWidth * ratio);
+//		} else if (height == RATIO) {
+//			double ratio = ((double)destWidth) / ((double)srcWidth);
+//			destHeight = (int)((double)srcHeight * ratio);
+//		}
+
+		/**
+		 * static int SCALE_AREA_AVERAGING
+		 * 		Area Averaging 이미지 슬캘링 알고리즘을 사용합니다.
+		 * static int SCALE_DEFAULT
+		 * 		디폴트의 이미지 슬캘링 알고리즘을 사용합니다.
+		 * static int SCALE_FAST
+		 * 		슬캘링 후의 이미지의 매끄러움보다 슬캘링 속도에 높은 우선 순위를 주는 이미지 슬캘링 알고리즘을 선택합니다.
+		 * static int SCALE_REPLICATE
+		 * 		ReplicateScaleFilter 클래스에서 구체화된 이미지 슬캘링 알고리즘을 사용합니다.
+		 * static int SCALE_SMOOTH
+		 * 		슬캘링 속도보다 이미지의 매끄러움에 높은 우선 순위를 주는 이미지 슬캘링 알고리즘을 선택합니다.
+		 */
+		Image imgTarget = srcImg.getScaledInstance(destWidth, destHeight, Image.SCALE_SMOOTH);
+		int pixels[] = new int[destWidth * destHeight];
+		PixelGrabber pg = new PixelGrabber(imgTarget, 0, 0, destWidth, destHeight, pixels, 0, destWidth);
+		try {
+			pg.grabPixels();
+		} catch (InterruptedException e) {
+			throw new IOException(e.getMessage());
+		}
+		BufferedImage destImg = new BufferedImage(destWidth, destHeight, BufferedImage.TYPE_4BYTE_ABGR_PRE);
+		destImg.setRGB(0, 0, destWidth, destHeight, pixels, 0, destWidth);
+		ImageIO.write(destImg, "png", dest);
+	}
+
+//	/**
+//	 * 회원가입시 인증번호를 넣은 이미지 생성
+//	 * @param src			원본 배경이미지 파일
+//	 * @param dest			배경이미지에 인증번호를 넣어서 만들 파일
+//	 * @param authNumber	인증번호(5자리가 최적 : 1 2 3 4 5)
+//	 * @throws IOException	파일입출력 예외사항
+//	 */
+//	public static void drawNumber(File src, File dest, String authNumber) throws IOException {
+//		Image srcImg = getImageObject(src);
+//		int destWidth = srcImg.getWidth(null);
+//		int destHeight = srcImg.getHeight(null);
+//
+//		Image imgTarget = srcImg.getScaledInstance(destWidth, destHeight, Image.SCALE_SMOOTH);
+//		int pixels[] = new int[destWidth * destHeight];
+//		PixelGrabber pg = new PixelGrabber(imgTarget, 0, 0, destWidth, destHeight, pixels, 0, destWidth);
+//		try {
+//			pg.grabPixels();
+//		} catch (InterruptedException e) {
+//			throw new IOException(e.getMessage());
+//		}
+//		BufferedImage destImg = new BufferedImage(destWidth, destHeight, BufferedImage.TYPE_INT_RGB);
+//		destImg.setRGB(0, 0, destWidth, destHeight, pixels, 0, destWidth);
+//
+//		Graphics2D destGD = destImg.createGraphics();
+//		destGD.drawString(authNumber, 20, 20);
+//
+//		ImageIO.write(destImg, "jpg", dest);
+//	}
+//
+//	public static void saveThumbnailImg(String path, String fileNm, int height, int width, String target) throws IOException {
+//		thumbnail(new File(path + fileNm), new File(path + target + fileNm), height, width);
+//	}
+
+}