상품상세 세트 개발중

src/main/webapp/WEB-INF/views/mob/goods/GoodsDetailFormMob.html

@@ -99,10 +99,8 @@
 				<div class="desc_status">예약판매 상품 - <em th:text="${goodsInfo.delvResDt}">2020.12.30</em> 출고예정</div>
 			</div>
 
-			<div class="inner">
+			<div class="inner" th:if="${goodsInfo.selfGoodsYn =='Y' and goodsInfo.goodsType =='G056_N'}"> <!-- 자사상품,일반상품 -->
 				<div class="option_box">
-					<th:block th:if="${goodsInfo.selfGoodsYn =='Y' }"> <!-- 자사상품 -->
-					<th:block th:if="${goodsInfo.goodsType =='G056_N' }">	<!-- 일반상품 -->
 					<div class="opt_color"  th:if="${goodsOption1List != null and !goodsOption1List.empty}">
 						<div class="opt_header">
 							<span class="title">컬러</span>
@@ -134,8 +132,6 @@
 						</div>
 					</div>
 					<div class="info_restock" style="display:none;"><a href="javascript:void(0);" id="btn_pushRestock_pop" class="btn_popup" th:onclick="cfGoodsInstockAlarmInfo([[${goodsInfo.goodsCd}]], [[${goodsInfo.colorCd}]])">재입고 알림 신청</a></div>
-					</th:block>
-					</th:block>
 				</div>
 			</div>
 
@@ -626,22 +622,7 @@
 						</div>
 						</th:block>
 						</th:block>
-						<th:block th:if="${goodsInfo.selfGoodsYn =='N' }"> <!--  입점상품 -->
-						<div class="opt_select">
-							<div class="form_wrap">
-								<div class="form_field">
-									<div class="select_custom option_open">
-										<div class="combo">
-											<div class="select">옵션을 선택해주세요</div>
-										</div>
-									</div>
-								</div>
-							</div>
-						</div>
-						<div class="opt_result">
-						</div>
-						</th:block>
-						<th:block th:if="${goodsInfo.goodsType =='G056_S' }">	<!-- 세트상품 -->
+						<th:block th:if="${goodsInfo.selfGoodsYn =='N' or goodsInfo.goodsType =='G056_S'}"> <!--  입점상품 -->
 						<div class="opt_select">
 							<div class="form_wrap">
 								<div class="form_field">
@@ -732,76 +713,32 @@
 								<!-- //일반상품일때 -->
 								<!-- 셋트상품일때 -->
 								<th:block th:if="${goodsInfo.goodsType =='G056_S' }">	<!-- 세트상품 -->
-								<div class="setOption">
-									<div class="form_wrap">
-										<div class="form_field">
-											<p class="title">슬림핏 마이크로 체크 네이비컬러 셋업수트 자켓</p>
-											<div class="select_custom item_opt1">
-												<div class="combo">
-													<div class="select">상품옵션01</div>
-													<ul class="list" style="display: none;">
-														<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
-														<li class="">선택</li> 
-														<li class="selected">상품옵션01</li>
-														<li>상품옵션02</li>
-														<li>상품옵션03</li>
-														<li aria-disabled="true">상품옵션05</li>
-														<li>상품옵션06</li>
-														<li aria-disabled="true" data-soldout="true">상품옵션07</li>
-													</ul>
-												</div>
-											</div>
-										</div>
-										<div class="form_field">
-											<div class="select_custom item_opt2" disabled>
-												<div class="combo">
-													<div class="select">상품옵션12</div>
-													<ul class="list" style="display: none;">
-														<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
-														<li class="">선택</li> 
-														<li class="">상품옵션11</li>
-														<li class="selected">상품옵션12</li>
-														<li>상품옵션13</li>
-														<li aria-disabled="true">상품옵션15</li>
-														<li>상품옵션16</li>
-														<li aria-disabled="true" data-soldout="true">상품옵션17</li>
-													</ul>
-												</div>
-											</div>
-										</div>
-									</div>
-									<div class="form_wrap">
+								<div class="setOption" th:if="${goodsComposeList != null and !goodsComposeList.empty}" >
+									<div class="form_wrap"  th:each="goodsCompose, status : ${goodsComposeList}">
 										<div class="form_field">
-											<p class="title">슬림핏 마이크로 체크 네이비컬러 셋업수트 바지</p>
-											<div class="select_custom item_opt1">
+											<p class="title" th:text="${goodsCompose.compsGoodsFullNm}">슬림핏</p>
+											<div class="select_custom item_opt1" th:classappend="${'item_opt1_'+status.count +' '+goodsCompose.compsGoodsCd}" 
+																				th:if="${goodsCompose.goodsOption1List != null and !goodsCompose.goodsOption1List.empty}" >
 												<div class="combo">
-													<div class="select">상품옵션01</div>
+													<div class="select">선택</div>
 													<ul class="list" style="display: none;">
-														<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
-														<li class="">선택</li> 
-														<li class="selected">상품옵션01</li>
-														<li>상품옵션02</li>
-														<li>상품옵션03</li>
-														<li aria-disabled="true">상품옵션05</li>
-														<li>상품옵션06</li>
-														<li aria-disabled="true" data-soldout="true">상품옵션07</li>
+														<th:block th:each="goodsOption, optionStatus : ${goodsCompose.goodsOption1List}" >
+														<li class="selected" th:id="|selfGoodsOpt1${goodsCompose.compsGoodsCd}|" th:if=${optionStatus.first}>선택</li> 
+														<li th:onclick="fnOption2([[${status.count}]], [[${goodsOption.goodsCd}]],[[${goodsOption.optCd1}]],[[${goodsCompose.qty}]],[[${goodsInfo.minOrdQty}]], [[${goodsInfo.maxOrdQty}]], [[${goodsOption.currPrice}]])"
+															th:attr="aria-disabled=${(goodsCompose.goodsStat != 'G008_90')? 'true':''}, data-soldout=${(goodsCompose.goodsStat != 'G008_90')? 'true':''}"
+															th:text="${goodsOption.optCd1}">상품옵션
+															<input type="hidden" name="opt" th:attr="addPrice=${goodsOption.addPrice}, optCd1=${goodsOption.optCd1},optCd2=${goodsOption.optCd2}, optCd=${goodsOption.optCd}"/>
+														</li>
+														</th:block>
 													</ul>
 												</div>
 											</div>
 										</div>
 										<div class="form_field">
-											<div class="select_custom item_opt2" disabled>
+											<div class="select_custom item_opt2" th:classappend="${'item_opt2_'+status.count +' '+goodsCompose.compsGoodsCd}" disabled>
 												<div class="combo">
-													<div class="select">상품옵션12</div>
-													<ul class="list" style="display: none;">
-														<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
-														<li class="">선택</li> 
-														<li class="">상품옵션11</li>
-														<li class="selected">상품옵션12</li>
-														<li>상품옵션13</li>
-														<li aria-disabled="true">상품옵션15</li>
-														<li>상품옵션16</li>
-														<li aria-disabled="true" data-soldout="true">상품옵션17</li>
+													<div class="select">선택</div>
+													<ul class="list" th:id="|goodsOpt2${goodsCompose.compsGoodsCd}|">
 													</ul>
 												</div>
 											</div>
@@ -1077,7 +1014,8 @@
 			
 			fnSetTotalPrice();
 			
-			$('.pop_option_select').css("display", "none");
+			// 해야하나 말아야하나
+			//$('.pop_option_select').css("display", "none");
 			
 		}, "text");
 	}
@@ -1153,7 +1091,7 @@
 		let jsonData = JSON.stringify(data);
 		gagajf.ajaxJsonSubmit('/goods/detail/option1/list', jsonData, function(result) {
 			
-			if (result.dataList != null && result.dataList.length > 0) {
+			if (result.dataList != null && result.dataList.length > 0) {debugger;
 				let tag = "";
 				let $obj = null;
 				
@@ -1183,7 +1121,7 @@
 					tag += '</div>\n';
 					//------	
 				}
-
+debugger;
 				if (selfGoodsYn == "Y"){
 					if (ridx == 1){
 						$obj = $('.pop_option_select .select_custom.item_opt1.item_opt1_1');	
@@ -1250,15 +1188,15 @@
 				
 				if (selfGoodsYn == "Y"){
 					if (ridx == 1){
-						$obj = $('.opt_set_select .select_custom.item_opt2.item_opt2_1');	
+						$obj = $('.pop_option_select .select_custom.item_opt2.item_opt2_1');	
 					}else if (ridx == 2){
-						$obj = $('.opt_set_select .select_custom.item_opt2.item_opt2_2');	
+						$obj = $('.pop_option_select .select_custom.item_opt2.item_opt2_2');	
 					}else if (ridx == 3){
-						$obj = $('.opt_set_select .select_custom.item_opt2.item_opt2_3');
+						$obj = $('.pop_option_select .select_custom.item_opt2.item_opt2_3');
 					}else if (ridx == 4){
-						$obj = $('.opt_set_select .select_custom.item_opt2.item_opt2_4');
+						$obj = $('.pop_option_select .select_custom.item_opt2.item_opt2_4');
 					}else{
-						$obj = $('.opt_set_select .select_custom.item_opt2.item_opt2_5');
+						$obj = $('.pop_option_select .select_custom.item_opt2.item_opt2_5');
 					}
 					
 				}else{
@@ -1307,19 +1245,19 @@
 				$obj.append(tag);
 				if (selfGoodsYn == "Y"){
 					if (ridx == 1){
-						var opt_selecter02_1 = new sCombo('.opt_set_select .select_custom.item_opt2.item_opt2_1');	
+						var opt_selecter02_1 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_1');	
 					}else if (ridx == 2){
-						var opt_selecter02_2 = new sCombo('.opt_set_select .select_custom.item_opt2.item_opt2_2');	
+						var opt_selecter02_2 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_2');	
 					}else if (ridx == 3){
-						var opt_selecter02_3 = new sCombo('.opt_set_select .select_custom.item_opt2.item_opt2_3');
+						var opt_selecter02_3 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_3');
 					}else if (ridx == 4){
-						var opt_selecter02_4 = new sCombo('.opt_set_select .select_custom.item_opt2.item_opt2_4');
+						var opt_selecter02_4 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_4');
 					}else{
-						var opt_selecter02_5 = new sCombo('.opt_set_select .select_custom.item_opt2.item_opt2_5');
+						var opt_selecter02_5 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_5');
 					}
 					
 				}else{
-					var opt_selecter02 = new sCombo('.opt_select .select_custom.item_opt2.item_opt2_1');
+					var opt_selecter02 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_1');
 				}	
 			}
 			
@@ -1645,34 +1583,12 @@
 		params.contentsLoc = "tmtb";
 		fnGoodsLikeSearch(params);
 	
-		// selecter
-		$(function(){
-			//var item_opt01 = new sCombo('.pd .pop_option_select .item_opt1');
-			//var item_opt02 = new sCombo('.pd .pop_option_select .item_opt2');
-			var opt_select = new sCombo('.pd .op1 .opt_select .select_custom');
-		});
-
-		//옵션변경 셀렉트
-		var opt_selecter01 = new sCombo('.pd .pop_option_select .item_opt1');
-		$('.pd .pop_option_select .select_custom .combo .list > li').click(function(e) {
-			$(this).parents('.form_field').next('.form_field').find('.select_custom').attr('disabled', false);
-			return false;
-		});
-		var opt_selecter02 = new sCombo('.pd .pop_option_select .item_opt2');
-
-		var opt_selecter03 = new sCombo('.pd .pop_option_select .item_opt3');
-		$('.pd .pop_option_select .select_custom .combo .list > li').click(function(e) {
-			$(this).parents('.form_field').next('.form_field').find('.select_custom').attr('disabled', false);
-			return false;
-		});
-		var opt_selecter04 = new sCombo('.pd .pop_option_select .item_opt4');
-
-		var opt_selecter05 = new sCombo('.pd .pop_option_select .item_opt5');
-		$('.pd .pop_option_select .select_custom .combo .list > li').click(function(e) {
-			$(this).parents('.form_field').next('.form_field').find('.select_custom').attr('disabled', false);
-			return false;
-		});
-		var opt_selecter06 = new sCombo('.pd .pop_option_select .item_opt6');
+	
+		var opt_selecter01_1 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_1');
+		var opt_selecter01_2 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_2');
+		var opt_selecter01_3 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_3');
+		var opt_selecter01_4 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_4');
+		var opt_selecter01_5 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_5');
 
 		if (!gagajf.isNull([[${goodsInfo.socialSq}]])){
 			$('.timer_box').css('display', 'block');