<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : GoodsDetailReviewFormWeb.html
 * @desc	: 상품평 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE		 AUTHOR		 DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.03.26   eskim	   최초 작성
 *******************************************************************************
 -->
<!-- 상품리뷰 리스트 내용 -->
 <div class="pd_review" th:with="imgGoodsUrl=${@environment.getProperty('upload.goods.view')}, uxImgUrl=${@environment.getProperty('domain.uximage')}, imgUrl=${@environment.getProperty('upload.image.view')}">
	<!-- 등록리뷰 없을 시 -->
	<div class="area_rv_empty" th:if="${reviewList == null or reviewList.empty}">
		<div class="txt_box">
			<p>
				지금 첫 리뷰를 작성하고<br>
				<span class="c_primary">스타일포인트 적립</span> 받으세요!
			</p>
			<dl>
				<div>
					<dt>일반리뷰</dt>
					<dd th:text="|${#numbers.formatInteger(reviewPoint.textReviewPoint, 0,'COMMA')}P|">0P</dd>
				</div>
				<div>
					<dt>포토/영상 리뷰</dt>
					<dd th:text="|${#numbers.formatInteger(reviewPoint.photoReviewPoint, 0,'COMMA')}P|">0P</dd>
				</div>
				<div>
					<dt>베스트 리뷰</dt>
					<dd th:text="|${#numbers.formatInteger(reviewPoint.bestReviewPoint, 0,'COMMA')}P|">0P</dd>
				</div>
			</dl>
		</div>
		<div class="btn_box">
			<button type="button" class="btn btn_dark" onclick="cfnGoToMypageReview();"><span>지금 리뷰 작성하기</span></button>
		</div>
	</div>
	<!-- //등록리뷰 없을 시 -->
	<!-- 등록리뷰 있을 시 -->
	<div class="area_rv_average" th:if="${reviewList != null and !reviewList.empty }">
		<th:block th:if="${goodsInfo.reviewRegCnt > 0}">
		<h6 class="sr-only">구매평점</h6>
		<div class="star_score">
			<span class="tit">구매평점</span>
			<span class="score" th:text="${goodsInfo.score}">4.3</span>
			<span class="star" th:with="starScore=${#numbers.formatDecimal((goodsInfo.score*100/5), 0,0)}">
				<em class="progbar" th:style="${'width:'+starScore+'%;' }"></em> <!-- 평점 style로 표기 -->
			</span>
		</div>
		</th:block>
		<!-- 착용정보 있을 시 노출 -->
		<th:block th:if="${not #strings.isEmpty(goodsInfo.sizeGb) and goodsInfo.reviewRegCnt > 0}">
		<div class="average">
			<div class="part_average">
				<span class="tit">사이즈</span>
				<dl th:with="scoreSize1=${#numbers.formatDecimal((goodsInfo.scoreSize1*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreSize2=${#numbers.formatDecimal((goodsInfo.scoreSize2*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreSize3=${#numbers.formatDecimal((goodsInfo.scoreSize3*100/goodsInfo.reviewRegCnt), 0,0)}">
					<div th:class="${(scoreSize1 >= scoreSize2 and scoreSize1 >= scoreSize3) ? 'on' : ''}">
						<dt>작음</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreSize1}"></th:block>%</span>
						</dd>
					</div> 
					<div th:class="${(scoreSize2 >= scoreSize1 and scoreSize2 >= scoreSize3) ? 'on' : ''}">
						<dt>딱맞음</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreSize2}"></th:block>%</span>
						</dd>
					</div>
					<div th:class="${(scoreSize3 >= scoreSize1 and scoreSize3 >= scoreSize2) ? 'on' : ''}">
						<dt>큼</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreSize3}"></th:block>%</span>
						</dd>
					</div>
				</dl>
			</div>
			<div class="part_average">
				<span class="tit">컬러</span>
				<dl th:with="scoreColor1=${#numbers.formatDecimal((goodsInfo.scoreColor1*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreColor2=${#numbers.formatDecimal((goodsInfo.scoreColor2*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreColor3=${#numbers.formatDecimal((goodsInfo.scoreColor3*100/goodsInfo.reviewRegCnt), 0,0)}">
					<div th:class="${(scoreColor1 >= scoreColor2 and scoreColor1 >= scoreColor3) ? 'on' : ''}">
						<dt>밝음</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreColor1}"></th:block>%</span>
						</dd>
					</div> 
					<div th:class="${(scoreColor2 >= scoreColor1 and scoreColor2 >= scoreColor3) ? 'on' : ''}">
						<dt>똑같음</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreColor2}"></th:block>%</span>
						</dd>
					</div>
					<div th:class="${(scoreColor3 >= scoreColor1 and scoreColor3 >= scoreColor2) ? 'on' : ''}">
						<dt>어두움</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreColor3}"></th:block>%</span>
						</dd>
					</div>
				</dl>
			</div>
			<th:block th:if="${goodsInfo.sizeGb == 'T' or goodsInfo.sizeGb == 'B'}">
			<div class="part_average">
				<span class="tit">핏</span>
				<dl th:with="scoreFit1=${#numbers.formatDecimal((goodsInfo.scoreFit1*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreFit2=${#numbers.formatDecimal((goodsInfo.scoreFit2*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreFit3=${#numbers.formatDecimal((goodsInfo.scoreFit3*100/goodsInfo.reviewRegCnt), 0,0)}">
					<div th:class="${(scoreFit1 >= scoreFit2 and scoreFit1 >= scoreFit3) ? 'on' : ''}">
						<dt>슬림</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreFit1}"></th:block>%</span>
						</dd>
					</div> 
					<div th:class="${(scoreFit2 >= scoreFit1 and scoreFit2 >= scoreFit3) ? 'on' : ''}">
						<dt>레귤러</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreFit2}"></th:block>%</span>
						</dd>
					</div>
					<div th:class="${(scoreFit3 >= scoreFit1 and scoreFit3 >= scoreFit2) ? 'on' : ''}">
						<dt>오버</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreFit3}"></th:block>%</span>
						</dd>
					</div>
				</dl>
			</div>
			<div class="part_average">
				<span class="tit">두께감</span>
				<dl th:with="scoreThick1=${#numbers.formatDecimal((goodsInfo.scoreThick1*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreThick2=${#numbers.formatDecimal((goodsInfo.scoreThick2*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreThick3=${#numbers.formatDecimal((goodsInfo.scoreThick3*100/goodsInfo.reviewRegCnt), 0,0)}">
					<div th:class="${(scoreThick1 >= scoreThick2 and scoreThick1 >= scoreThick3) ? 'on' : ''}">
						<dt>얇음</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreThick1}"></th:block>%</span>
						</dd>
					</div> 
					<div th:class="${(scoreThick2 >= scoreThick1 and scoreThick2 >= scoreThick3) ? 'on' : ''}">
						<dt>적당함</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreThick2}"></th:block>%</span>
						</dd>
					</div>
					<div th:class="${(scoreThick3 >= scoreThick1 and scoreThick3 >= scoreThick2) ? 'on' : ''}">
						<dt>도톰함</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreThick3}"></th:block>%</span>
						</dd>
					</div>
				</dl>
			</div>
			</th:block>
			<th:block  th:if="${goodsInfo.sizeGb == 'S'}">
			<div class="part_average">
				<span class="tit">무게감</span>
				<dl th:with="scoreWeight1=${#numbers.formatDecimal((goodsInfo.scoreWeight1*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreWeight2=${#numbers.formatDecimal((goodsInfo.scoreWeight2*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreWeight3=${#numbers.formatDecimal((goodsInfo.scoreWeight3*100/goodsInfo.reviewRegCnt), 0,0)}">
					<div th:class="${(scoreWeight1 >= scoreWeight2 and scoreWeight1 >= scoreWeight3) ? 'on' : ''}">
						<dt>가벼움</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreWeight1}"></th:block>%</span>
						</dd>
					</div> 
					<div th:class="${(scoreWeight2 >= scoreWeight1 and scoreWeight2 >= scoreWeight3) ? 'on' : ''}">
						<dt>적당함</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreWeight2}"></th:block>%</span>
						</dd>
					</div>
					<div th:class="${(scoreWeight3 >= scoreWeight1 and scoreWeight3 >= scoreWeight2) ? 'on' : ''}">
						<dt>무거움</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreWeight3}"></th:block>%</span>
						</dd>
					</div>
				</dl>
			</div>
			<div class="part_average">
				<span class="tit">볼너비</span>
				<dl th:with="scoreBall1=${#numbers.formatDecimal((goodsInfo.scoreBall1*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreBall2=${#numbers.formatDecimal((goodsInfo.scoreBall2*100/goodsInfo.reviewRegCnt), 0,0)}
							, scoreBall3=${#numbers.formatDecimal((goodsInfo.scoreBall3*100/goodsInfo.reviewRegCnt), 0,0)}">
					<div th:class="${(scoreBall1 >= scoreBall2 and scoreBall1 >= scoreBall3) ? 'on' : ''}">
						<dt>작음</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreBall1}"></th:block>%</span>
						</dd>
					</div> 
					<div th:class="${(scoreBall2 >= scoreBall1 and scoreBall2 >= scoreBall3) ? 'on' : ''}">
						<dt>딱맞음</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreBall2}"></th:block>%</span>
						</dd>
					</div>
					<div th:class="${(scoreBall3 >= scoreBall1 and scoreBall3 >= scoreBall2) ? 'on' : ''}">
						<dt>큼</dt>
						<dd>
							<span class="ratio">
								<em class="progbar"></em>
							</span>
							<span class="percent"><th:block th:text="${scoreBall3}"></th:block>%</span>
						</dd>
					</div>
				</dl>
			</div>
			</th:block>
		</div>
		</th:block>
		<!-- //착용정보 있을 시 노출 -->
		<div class="info_review">
			<p>
				<i class="ico_point"></i>상품 리뷰 작성 시 <span>스타일포인트 추가 적립!</span>
			</p>
			<dl>
				<div>
					<dt>일반리뷰</dt>
					<dd th:text="|${#numbers.formatInteger(reviewPoint.textReviewPoint, 0,'COMMA')}P|">0P</dd>
				</div>
				<div>
					<dt>포토/영상 리뷰</dt>
					<dd th:text="|${#numbers.formatInteger(reviewPoint.photoReviewPoint, 0,'COMMA')}P|">0P</dd>
				</div>
				<div>
					<dt>베스트 리뷰</dt>
					<dd th:text="|${#numbers.formatInteger(reviewPoint.bestReviewPoint, 0,'COMMA')}P|">0P</dd>
				</div>
			</dl>
		</div>
	</div>
	<div class="area_rv_best" th:if="${bestReviewList != null and !bestReviewList.empty}">
		<h6>베스트 리뷰</h6>
		<div class="btn_arrow">	
			<div class="swiper-button-prev"></div>  
			<div class="swiper-button-next"></div>
		</div>
		<div class="swiper-container">
			<div class="swiper-wrapper">
				<div class="swiper-slide" th:each="bestReview, status : ${bestReviewList}" >
					<div class="best_review">
						<a href="javascript:void(0);" th:onclick="cfGoodsReviewDetail([[${goodsInfo.goodsCd}]], 'Y', '', [[${bestReview.reviewSq}]])" >
							<div class="pic" th:if="${bestReview.reviewAttachList != null and !bestReview.reviewAttachList.empty}">
								<th:block th:each="reviewAttach, attachStatus : ${bestReview.reviewAttachList}" th:if="${attachStatus.first}">
									<th:block th:if="${reviewAttach.fileGb == 'M'}">
									<span class="thumb mov" th:style="${'background-image:url('+kollusMediaUrl+'/poster/'+reviewAttach.kmcKey+');'}"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
									</th:block>
									<th:block th:unless="${reviewAttach.fileGb == 'M'}">
									<span class="thumb" th:style="${'background-image:url('+imgUrl+ reviewAttach.sysFileNm+');'}"></span>
									</th:block>
								</th:block>
							</div>
							<div class="star_score" th:with="starScore=${#numbers.formatDecimal((bestReview.iscore*100/5), 0,0)}">
								<span class="star">
									<em class="progbar" th:style="${'width:'+starScore+'%;' }"></em> <!-- 평점 style로 표기 -->
								</span>
								<em class="ico ico_besttag"></em>
							</div>
							<div class="txt_best_review">
								<p th:text="${bestReview.reviewContent}">옷</p>
							</div>
						</a>
					</div>
				</div>
			</div>
			<div class="swiper-pagination"></div>
		</div>
	</div>
	<div class="area_rv_photo"  th:if="${photoReviewList != null and !photoReviewList.empty}">
		<h6>포토/영상 리뷰</h6>
		<div class="photo_list">
			<ul>
				<li  th:each="photoReview, status : ${photoReviewList}" th:if="${status.count<=7}">
					<th:block th:if="${photoReview.reviewAttachList != null and !photoReview.reviewAttachList.empty}">
					<th:block th:each="reviewAttach, attachStatus : ${photoReview.reviewAttachList}" th:if="${attachStatus.first}">
					<a href="javascript:void(0);" th:onclick="cfGoodsReviewDetail([[${goodsInfo.goodsCd}]], '', 'Y', [[${photoReview.reviewSq}]])">
						<div class="pic">
							<th:block th:if="${reviewAttach.fileGb == 'M'}">
							<span class="thumb mov" th:style="${'background-image:url('+kollusMediaUrl+'/poster/'+reviewAttach.kmcKey+');'}"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
							</th:block>
							<th:block th:unless="${reviewAttach.fileGb == 'M'}">
							<span class="thumb" th:style="${'background-image:url('+imgUrl+ reviewAttach.sysFileNm+');'}"></span>
							</th:block>
						</div>
					</a>
					</th:block>
					</th:block>
				</li>
			</ul>
			<!-- 포토영상 게시글 최대 7개 & 버튼노출 -->
			<th:block th:if="${#lists.size(photoReviewList) >= 8}"> <!-- 나중에 8로 수정 -->
			<button type="button" id="btn_more_photoreview" th:onclick="cfGoodsReviewPhoto([[${goodsInfo.goodsCd}]])" ><span>더 보기</span></button>
			<!-- //포토영상 게시글 최대 7개 & 버튼노출 -->
			</th:block>
		</div>
	</div>
	<div class="area_rv_all"  style="display:none;">
	<form id="goodsReviewForm" name="goodsReviewForm" action="#" th:action="@{'/goods/review/list'}">
	<input type="hidden" name="pageNo" value ="1"/>
	<input type="hidden" name="pageSize" value ="20"/>
	<input type="hidden" name="goodsCd" th:value ="${goodsInfo.goodsCd}"/>
	<input type="hidden" name="goodsType" th:value ="${goodsInfo.goodsType}"/>
	<input type="hidden" name="selfGoodsYn" th:value ="${goodsInfo.selfGoodsYn}"/>
	<input type="hidden" name="reviewScore" />
	<input type="hidden" name="reviewOption" />
	<input type="hidden" name="reviewHeight" />
	<input type="hidden" name="reviewWeight" />
	
		<h6>전체리뷰<span>(<span id="reviewCount" th:text="${(reviewCount <= 9999) ? #numbers.formatInteger(reviewCount, 0,'COMMA') : '9,999+'}">9,999+</span>)</span></h6>
		<div class="selection">
			<div class="form_field">
				<div class="select_custom sort_opt1">
					<div class="combo">
						<div class="select">평점 전체<input type="hidden" name="selScore" value=""/></div>
						<ul class="list" onclick="fnReviewSearch();" >
							<!-- 선택처리 class="selected" -->
							<li class="selected" >평점 전체<input type="hidden" name="selScore" value=""/></li> 
							<li>5점&nbsp;&starf;&starf;&starf;&starf;&starf;<input type="hidden" name="selScore" value="5"/></li>
							<li>4점&nbsp;&starf;&starf;&starf;&starf;<input type="hidden" name="selScore" value="4" scoreId="4"/></li>
							<li>3점&nbsp;&starf;&starf;&starf;<input type="hidden" name="selScore" value="3"/></li>
							<li>2점&nbsp;&starf;&starf;<input type="hidden" name="selScore" value="2"/></li>
							<li>1점&nbsp;&starf;<input type="hidden" name="selScore" value="1"/></li>
						</ul>
					</div>
				</div>
				<div class="select_custom sort_opt2" th:if="${reviewOptionList != null and !reviewOptionList.empty}">
					<div class="combo">
						<th:block th:if="${(goodsInfo.selfGoodsYn == 'Y')}">
						<div class="select">사이즈 전체<input type="hidden" name="selOption" value=""/></div>
						</th:block>
						<th:block th:unless="${(goodsInfo.selfGoodsYn == 'Y')}">
						<div class="select">옵션 전체<input type="hidden" name="selOption" value=""/></div>
						</th:block>
						<ul class="list" onclick="fnReviewSearch();">
							<!-- 선택처리 class="selected" -->
							<li class="selected" th:text="${(goodsInfo.selfGoodsYn == 'Y')? '사이즈 전체' :'옵션 전체'}">사이즈 전체</li> 
							<li th:each="reviewOption, status : ${reviewOptionList}" >
							<th:block th:text="${reviewOption.optCd}"></th:block>
							<input type="hidden" name="selOption" th:value="${reviewOption.optCd}"/>
							</li>
						</ul>
					</div>
				</div>
				<div class="select_custom sort_opt3" th:if="${reviewHeightList != null and !reviewHeightList.empty}">
					<div class="combo">
						<div class="select">키 전체<input type="hidden" name="selHeight" value=""/></div>
						<ul class="list" onclick="fnReviewSearch();">
							<!-- 선택처리 class="selected" -->
							<li class="selected">키 전체<input type="hidden" name="selHeight" value=""/></li> 
							<li th:each="reviewHeight, status : ${reviewHeightList}" >
							<th:block th:text="${reviewHeight.cdNm}"></th:block>
							<input type="hidden" name="selHeight" th:value="${reviewHeight.cd}"/>
							</li>
						</ul>
					</div>
				</div>
				<div class="select_custom sort_opt4" th:if="${reviewWeightList != null and !reviewWeightList.empty}">
					<div class="combo">
						<div class="select">몸무게 전체<input type="hidden" name="selWeight" value=""/></div>
						<ul class="list" onclick="fnReviewSearch();">
							<!-- 선택처리 class="selected" -->
							<li class="selected">몸무게 전체<input type="hidden" name="selWeight" value=""/></li> 
							<li th:each="reviewWeight, status : ${reviewWeightList}" >
							<th:block th:text="${reviewWeight.cdNm}"></th:block>
							<input type="hidden" name="selWeight" th:value="${reviewWeight.cd}"/>
							</li>
							
						</ul>
					</div>
				</div>
			</div>
		</div>
		<!-- 나열조건결과 있을 때 노출 내용 -->
		<div class="review_list">
			<ul  id="ulGoodsReview">
			</ul>
		</div>
		<div class="ui_row">
			<ul class="pageNav" id="pageNav">
			</ul>
		</div>
		<!-- //나열조건결과 있을 때 노출 내용 -->
		<!-- 나열조건결과 없을 때 노출 내용 -->
		<div class="nodata"  style="display:none;">
			<div class="txt_box">
				<p>
					선택하신 조건에 맞는 리뷰가 없습니다.<br>
					조건을 변경해 보세요.
				</p>
			</div>
			<div class="btn_box" th:if="${reviewCount> 0}">
				<button type="button" class="btn btn_default" onclick="fnReviewSearchInit();"><span>선택한 조건 초기화</span></button>
			</div>
		</div>
		<!-- //나열조건결과 없을 때 노출 내용 -->
	</form>	
	</div>
	<!-- //등록리뷰 있을 시 -->
</div>
<script src="/ux/plugins/gaga/gaga.paging.js"></script>
<script th:inline="javascript">
/*<![CDATA[*/
	
	var fnGetList = function() {

		/* $('#goodsReviewForm  input[name="secretYn"]').val('');
		if ($("#goodsReviewForm input:checkbox[name=except_secret]").is(':checked')){
			$('#goodsReviewForm  input[name="secretYn"]').val('N');
		} */
		// Initialize a pagination
		gagaPaging.init('goodsReviewForm', fnGetListCallback, 'pageNav', 20);

		// Load data
		gagaPaging.load(1);
	}
	
	var fnGetListCallback = function(result) {
		$('#ulGoodsReview').html('');
		$('#goodsReviewForm').find('.nodata').hide();
		$('#goodsReviewForm').find('.ui_row').show();
		// 목록
		if (result.dataList != null && result.dataList.length > 0) {
			
			$('.area_rv_all').show();
			$('#goodsReviewForm').find('.review_list').show();
			$.each(result.dataList, function(idx, item) {
				let tag = '<li>\n';
				tag += '<div class="review">\n';
				tag += '	<div class="info_box">\n';
				tag += '		<div class="star_score">\n';
				tag += '			<span class="star">\n';
				tag += '				<em class="progbar" style="width:'+(item.score*20)+'%;"></em>\n'; //<!-- 평점 style로 표기 -->
				tag += '			</span>\n';
				tag += '		</div>\n';
				tag += '		<div class="writer">\n';
				tag += '			<span class="wr_id">'+ item.maskingCustId +'</span>\n';
				tag += '			<span class="wr_date">' + item.regDt + '</span>\n';
				tag += '		</div>\n';
				tag += '	</div>\n';
				tag += '	<div class="response_box">\n';
				tag += '		<div>\n';
				tag += '			<dl>\n';
				tag += '				<div>\n';
				tag += '					<dt>구매옵션</dt>\n';
				if (item.goodsOptionList != null && item.goodsOptionList.length > 0){
				tag += '					<dd>';	
					$.each(item.goodsOptionList, function(gIdx, goodsOption){
				tag += '					'+ gagajf.convNull(goodsOption.optCd1Nm,'') +' / '+ gagajf.convNull(goodsOption.optCd2,'') ;		
				if ((gIdx+1) < item.goodsOptionList.length){
				tag += ', ';
				}
					});
				tag += '					</dd>';	
				}
				tag += '				</div>\n';
				tag += '			</dl>\n';
				tag += '		</div>\n';
				tag += '		<div>\n';
				tag += '			<dl>\n';
				
				// 2021.08.11 키, 몸무게 정보가 있으면 노출
				if (item.height > 0 || item.weight > 0 ) {
					tag += '				<div>\n';
					tag += '					<dt>키/몸무게</dt>\n';
					tag += '					<dd>'+ item.height +'cm/'+ item.weight +'kg</dd>\n';
					tag += '				</div>\n';
				}
				
				if (!gagajf.isNull(item.sizeGb) ){	// 사이즈구분값이 있을경우 노출
					tag += '				<div>\n';
					tag += '					<dt>사이즈</dt>\n';
					tag += '					<dd>'+ gagajf.convNull(item.scoreSizeNm,'') +'</dd>\n';
					tag += '				</div>\n';
					tag += '				<div>\n';
					tag += '					<dt>컬러</dt>\n';
					tag += '					<dd>'+ gagajf.convNull(item.scoreColorNm,'') +'</dd>\n';
					tag += '				</div>\n';
				if (item.sizeGb == 'T' || item.sizeGb == 'B'){
					tag += '				<div>\n';
					tag += '					<dt>핏</dt>\n';
					tag += '					<dd>'+ gagajf.convNull(item.scoreFitNm,'') +'</dd>\n';
					tag += '				</div>\n';
					tag += '				<div>\n';
					tag += '					<dt>두께감</dt>\n';
					tag += '					<dd>'+ gagajf.convNull(item.scoreThickNm,'') +'</dd>\n';
					tag += '				</div>\n';	
				}
				if (item.sizeGb == 'S' ){
					tag += '				<div>\n';
					tag += '					<dt>무게감</dt>\n';
					tag += '					<dd>'+ gagajf.convNull(item.scoreWeightNm,'') +'</dd>\n';
					tag += '				</div>\n';
					tag += '				<div>\n';
					tag += '					<dt>볼너비</dt>\n';
					tag += '					<dd>'+ gagajf.convNull(item.scoreBallNm,'') +'</dd>\n';
					tag += '				</div>\n';	
				}
				}
				tag += '			</dl>\n';
				tag += '		</div>\n';
				tag += '	</div>\n';
				tag += '	<div class="photo_box">\n';
				tag += '		<div class="photo_list">\n';
				tag += '			<ul>\n';
				if (item.reviewAttachList != null && item.reviewAttachList.length > 0){
					var fileGbClass = '';
					$.each(item.reviewAttachList, function(aIdx, reviewAttach){
//						fileGbClass = '';
//						if (reviewAttach.fileGb == "M") fileGbClass = "mov";
				tag += '				<li>\n';
				tag += '					<a href="javascript:void();" onclick="cfGoodsReviewDetail(\''+item.goodsCd+'\',\'\', \'Y\',\''+item.reviewSq+'\','+aIdx+');">\n';
				tag += '						<div class="pic">\n';
					if (reviewAttach.fileGb == "M") {
				tag +='					<span class="thumb mov" style="background-image:url('+_kollusMediaUrl +'/poster/'+reviewAttach.kmcKey +');\" ></span>\n';
					}else{
				tag +='					<span class="thumb" style="background-image:url('+ _imgUrl + reviewAttach.sysFileNm +');\" ></span>\n';
					}
				tag += '						</div>\n';
				tag += '					</a>\n';
				tag += '				</li>\n';		
					});	
				}
				tag += '			</ul>\n';
				tag += '		</div>\n';
				tag += '	</div>\n';
				tag += '	<div class="txt_review_box">\n';
				tag += '		<p>' + item.reviewContent +'</p>\n';
				tag += '	</div>\n';
				if (!gagajf.isNull(item.admRpl)){
					tag += '	<div class="reply_box">\n';
					tag += '		<div class="reply">\n';
					tag += '			<div class="reply_writer">\n';
					tag += '				<span class="wr_name">관리자</span>\n';
					tag += '				<span class="wr_date">'+item.admRplDt+'</span>\n';
					tag += '			</div>\n';
					tag += '			<div class="reply_txt">\n';
					tag += '				<p>' + item.admRpl+'</p>\n';
					tag += '			</div>\n';
					tag += '		</div>\n';
					tag += '	</div>\n';	
				}
				tag += '</div>\n';
				tag += '</li>\n';
				
				$('#ulGoodsReview').append(tag);
			});
		} else {
			if ([[${reviewCount}]] > 0){
				$('#goodsReviewForm').find('.nodata').show();	
			}
			$('#goodsReviewForm').find('.ui_row').hide();
			$('#goodsReviewForm').find('.review_list').hide();
		}

		// Create pagination
		gagaPaging.createPagination(result.paging.pageable);
	}
	
	// 상품평 검색조건 클릭시
	var fnReviewSearch = function(){
		let reviewScore = $('#goodsReviewForm').find('.select_custom.sort_opt1').find('.select input[name=selScore]').val();
		let reviewOption = $('#goodsReviewForm').find('.select_custom.sort_opt2').find('.select input[name=selOption]').val();
		let reviewHeight = $('#goodsReviewForm').find('.select_custom.sort_opt3').find('.select input[name=selHeight]').val();
		let reviewWeight = $('#goodsReviewForm').find('.select_custom.sort_opt4').find('.select input[name=selWeight]').val();
		
		let changFlag = false;
		if ($('#goodsReviewForm input[name=reviewScore]').val() != reviewScore){
			changFlag = true;
		}else if ($('#goodsReviewForm input[name=reviewOption]').val() != reviewOption){
			changFlag = true;
		}else if ($('#goodsReviewForm input[name=reviewHeight]').val() != reviewHeight){
			changFlag = true;
		}else if ($('#goodsReviewForm input[name=reviewWeight]').val() != reviewWeight){
			changFlag = true;
		}
		
		$('#goodsReviewForm input[name=reviewScore]').val(reviewScore);
		$('#goodsReviewForm input[name=reviewOption]').val(reviewOption);
		$('#goodsReviewForm input[name=reviewHeight]').val(reviewHeight);
		$('#goodsReviewForm input[name=reviewWeight]').val(reviewWeight);
		
		if (changFlag) fnGetList();
		
	}
	
	// 상품평 초기화
	var fnReviewSearchInit = function(){
		
		$('#goodsReviewForm').find('.select_custom.sort_opt1').find('.list li').eq(0).trigger('click')
		$('#goodsReviewForm').find('.select_custom.sort_opt2').find('.list li').eq(0).trigger('click')
		$('#goodsReviewForm').find('.select_custom.sort_opt3').find('.list li').eq(0).trigger('click')
		$('#goodsReviewForm').find('.select_custom.sort_opt4').find('.list li').eq(0).trigger('click')
		
		$('#goodsReviewForm input[name=reviewScore]').val('');
		$('#goodsReviewForm input[name=reviewOption]').val('');
		$('#goodsReviewForm input[name=reviewHeight]').val('');
		$('#goodsReviewForm input[name=reviewWeight]').val('');
		
		fnGetList();
	}
	
	$(document).ready( function() {

		//슬라이드 - 베스트리뷰
	    var bestReviewtSwiper = new Swiper('.area_rv_best .swiper-container', {
	        slidesPerView: 2,
	        spaceBetween: 20,
	        navigation: {
	            nextEl: '.area_rv_best .swiper-button-next',
	            prevEl: '.area_rv_best .swiper-button-prev',
	        },
	        pagination: {
	            el: '.area_rv_best .swiper-pagination',
	            clickable: true,
	        },
	    });

		
		var sort_selecter01 = new sCombo('.area_rv_all .selection .select_custom.sort_opt1');
		var sort_selecter02 = new sCombo('.area_rv_all .selection .select_custom.sort_opt2');
		var sort_selecter03 = new sCombo('.area_rv_all .selection .select_custom.sort_opt3');
		var sort_selecter04 = new sCombo('.area_rv_all .selection .select_custom.sort_opt4');
	
		//착용정보 통계
		$('.average .part_average .percent').each(function(){
			var reviewRatio = $(this).text();
			if (reviewRatio == '0%'){
				$(this).parents('div dl dd').find('.ratio .progbar').attr('style', 'width:0; margin-left:-8px');
			} else {
				$(this).parents('div dl dd').find('.ratio .progbar').attr('style', 'width:' + reviewRatio);
			}
		});
			//fnGetList();	
		
	});
	
/*]]>*/
</script>
 </html>