<%@ page import="kr.co.jinwoosi.clfd.conts.prod.model.Prod" %>
<%@ page import="java.text.DecimalFormat" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/view/include/tags.jspf" %>
<%
    DecimalFormat df = new DecimalFormat("#,###");
    Integer prodPrc = ((Prod) request.getAttribute("prod")).getProdPrc();
    Double prodCpcty = ((Prod) request.getAttribute("prod")).getProdCpcty();
    String formattedProdPrice = "0";
    String formattedDotCpcty = "0";
    if (prodPrc != null) {
        formattedProdPrice = df.format(((Prod) request.getAttribute("prod")).getProdPrc());
    }
    if (prodCpcty != null) {
        formattedDotCpcty = df.format(((Prod) request.getAttribute("prod")).getProdCpcty());
    }
%>
<script src="/clfd/js/prod/prodLikeService.js?ver=1.3"></script>
<script src="/clfd/js/common/clfdCommonService.js?ver=1.1"></script>
<script src="/clfd/js/prod/prodDtlService.js?ver=1.3"></script>
<script src="/clfd/js/prod/dtl.js?ver=1.6"></script>
<script src="/clfd/js/front/clfd_dtl.js?ver=1.1"></script>
<div class="pathbar">
    <div class="pathbar__text">
    </div>
</div>

<div class="dtl-wrapper">
    <div class="dtl-inner01">
        <div class="dtl-inner02" style="margin: 0;">
            <div class="dtl-inner02__sch">
                <%--<img src="/clfd/img/clfd_logo30.png" alt="error" style="margin: 4px 3px;">--%>
                <div class="dtl-inner02__sch__box">
                    <input id="searchByTextInput" type="text" placeholder="찾고 싶은 상품을 검색해보세요!">
                    <button id="searchByTextButton"><i class="fas fa-search"></i></button>
                </div>
            </div>
            <div class="dtl-inner02__container">
                <div class="dtl__img" style="background-color: white;">
                    <img src="/clfd/image/${prod.imageDir}_${prod.prodImage}" alt="error" style="margin: 60px auto 0 auto; height: 400px; width: 100%; object-fit: contain;">
                </div>
                <div class="dtl__img__m" style="background-color: white;">
                    <img src="/clfd/image/${prod.imageDir}_${prod.prodImage}" alt="error" style="margin: 4px 3px; width: 100%; height: 320px; object-fit: contain;">
                </div>
                <div class="dtl-inner02__item">
                    <div>
                        <div class="dtl-text__pr">${prod.prodNm}</div>
                        <div class="dtl-textBox__ap">
                            <div class="dtl-text__am"><%=formattedProdPrice%>원</div>
                            <div class="dtl-text__ca">/ <%=formattedDotCpcty%>ml</div>
                        </div>
                    </div>
                    <div class="product-inner02__item__conter">
                        <div class="dtl-text__left">피부타입</div>
                        <div id="baumanTypeDiv" class="dtl-text__right"></div>
                    </div>
                    <div class="product-inner02__item__conter">
                        <div class="dtl-text__left">제형</div>
                        <div class="dtl-text__right">${prod.prodTyNm}</div>
                    </div>
                    <div class="product-inner02__item__conter">
                        <div class="dtl-text__left">성분</div>
                        <div id="prodIrdntDiv" class="dtl-text__right">
                            ${prod.prodIrdnt}
                        </div>
                    </div>
                    <div class="product-inner02__item__bottom">
                        <div id="likeRoot" class="dtl-ico__att">
                        </div>
                    </div>
                </div>
            </div>
            <%--<c:if test="${prod.similarList ne '[]'}">
                <div class="dtl-inner02__rec">
                    <div class="dtl-inner02__rec__text">이 화장품은 어때요?</div>
                    <div id="sktyProdDiv" class="dtl-inner02__rec__list">
                        <c:forEach var="s" items="${prod.similarList}">
                            <div class="dtl-inner02__rec__list__content">
                                <c:choose>
                                    <c:when test="${s.cmsCode != null && s.companyCode != null && s.productCode != null }">
                                        <a href="/clfd/prod/dtl.do?cmsCode=${s.cmsCode}&companyCode=${s.companyCode}&productCode=${s.productCode}">
                                    </c:when>
                                    <c:otherwise>
                                        <a href="#">
                                    </c:otherwise>
                                </c:choose>
                                    <div class="dtl-inner02__divImg">
                                        <img src="${s.imgUrl}" alt="" style="margin: auto auto;">
                                    </div>
                                    <div class="card__contents">
                                        <div class="dtl-text__co__rec" href="">${s.companyName}</div>
                                        <div class="dtl-text__pr__rec" href="">${s.productName}</div>
                                        &lt;%&ndash;<div class="card__contents__ac">
                                            <div class="dtl-text__am__rec" href=" "><span class="dot__format similar__product__price">${s.productPrice}</span></div>
                                            <div class="dtl-text__ca__rec" href=" "> / <span class="dot__format similar__product__volume">${s.productVolume}</span>ml</div>
                                        </div>&ndash;%&gt;
                                    </div>
                                </a>
                            </div>
                        </c:forEach>
                    </div>
                </div>
            </c:if>--%>
        </div>
    </div>
</div>

<input id="prodId" value="${prod.prodId}" type="hidden"/>
<input id="like" value="${prod.like}" type="hidden"/>
<input id="rcmdNo" value="${prod.rcmdNo}" type="hidden"/>
<input id="skTy" value="${prod.skTy}" type="hidden"/>