index.phtml 12.1 KB
{{> layout/header}}
<div class="product-detail-page yoho-page">
    {{# detail}}

        {{# banner}}
            <div class="brand-banner" style="background:{{bgColor}}{{#if bgImg}} url({{bgImg}}){{/if}}">
                <div class="center-content clearfix">
                    <a class="pull-left" href="{{homeUrl}}">
                        <img src="{{logo}}" alt="{{alt}}">
                    </a>

                    <div class="opt pull-right">
                        <a class="home" href="{{homeUrl}}">
                            <span class="iconfont">&#xe617;</span>
                        </a>
                        <span id="brand-favour" class="brand-fav">
                            <i class="iconfont{{#if coled}} coled{{/if}}">&#xe616;</i>
                        </span>
                    </div>
                </div>
            </div>
        {{/ banner}}

        <div class="center-content">
            {{> layout/path-nav}}
            
            {{# goodInfo}}
                <div class="main clearfix">
                    <div class="pull-left imgs clearfix">
                        <div class="pull-left img">
                            <div class="tags clearfix">
                                {{# tags}}
                                    {{# isNew}}
                                        <span class="good-tag new-tag">NEW</span>
                                    {{/ isNew}}
                                    {{# isReNew}}
                                        <span class="good-tag renew-tag">再到着</span>
                                    {{/ isReNew}}
                                    {{# isSale}}
                                        <span class="good-tag sale-tag">SALE</span>
                                    {{/ isSale}}
                                    {{# isNewFestival}}
                                        <span class="good-tag new-festival-tag">新品节</span>
                                    {{/ isNewFestival}}
                                    {{# isLimit}}
                                        <span class="good-tag limit-tag">限量商品</span>
                                    {{/ isLimit}}
                                    {{# isYearEndPromotion}}
                                        <span class="good-tag yep-tag">年终大促</span>
                                    {{/ isYearEndPromotion}}
                                    {{# isYearMidPromotion}}
                                        <span class="good-tag ymp-tag">年中热促</span>
                                    {{/ isYearMidPromotion}}
                                    {{# isFew}}
                                        <p class="good-tag few-tag">即将售罄</p>
                                    {{/ isFew}}
                                {{/ tags}}
                            </div>
                            <img class="img-show" src="{{img}}">
                        </div>
                        <div class="pull-right thumbs">
                            {{# thumbs}}
                                <a href="{{url}}">
                                    <img class="thumb" src="{{img}}">
                                </a>
                            {{/ thumbs}}
                        </div>
                    </div>
                    <div class="pull-right infos">
                        <p class="name">
                            {{name}}
                        </p>
                        <a class="brand-name" href="{{brandUrl}}">{{brandName}}</a>
                        <p class="market-price {{#if salePrice}}with-sale{{/unless}}">
                            <span class="title">市场价:</span>
                            <span class="price">¥{{marketPrice}}</span>
                        </p>
                        {{#if salePrice}}
                            <p class="sale-price">
                                <span class="title">促销价:</span>
                                <span class="price">¥{{salePrice}}</span>
                            </p>
                        {{/if}}

                        {{#if activity}}
                            <ul class="activity">
                                {{#each activity}}
                                    <li>
                                        {{#if sizeImg}}
                                            <a class="img-link" href="{{url}}">
                                                <img src="{{sizeImg}}">
                                            </a>
                                        {{^}}
                                            <span class="ac-type">{{type}}</span>
                                            <span class="ac-des">【{{des}}】</span>
                                        {{/if}}
                                    </li>
                                {{/each}}
                            </ul>
                        {{/if}}

                        <div class="chose-color row clearfix">
                            <span class="title pull-left">选颜色:</span>
                            <ul class="colors pull-left">
                                {{#each colors}}
                                    <li class="{{#if focus}}focus{{/if}} {{#if disable}}disable{{/if}}" title="{{title}}">
                                        <img src="{{src}}">
                                    </li>
                                {{/each}}
                            </ul>
                        </div>

                        <div class="chose-size row clearfix">
                            <span class="title pull-left">选尺码:</span>

                            <div class="size-wrapper pull-left">
                                {{#each colors}}
                                    <ul class="size {{#unless focus}}hide{{/unless}} clearfix">
                                        {{#each size}}
                                            <li {{#if disable}}class="disable"{{/if}} data-title="{{title}}" data-sku="{{sku}}">{{name}}</li>
                                        {{/each}}
                                    </ul>
                                {{/each}}
                                <span class="size-ruler"></span>

                                <span class="size-warn hide">
                                    <i></i>
                                    请选择尺码
                                </span>

                                <span class="color-size-tip hide"></span>
                            </div>
                        </div>

                        <div class="chose-count row clearfix">
                            <span class="title pull-left">选数量:</span>
                            <div class="num-wraper pull-left clearfix">
                                <span id="num" class="num pull-left">1</span>
                                <span class="minus-plus pull-left">
                                    <i class="plus iconfont">&#xe610;</i>
                                    <i class="minus iconfont">&#xe600;</i>
                                </span>
                                <span class="num-warn hide">
                                    <i></i>
                                    库存不足
                                </span>
                            </div>
                        </div>

                        <p class="row">
                            <span id="add-to-cart" class="add-to-cart">
                                <i class="iconfont">&#xe628;</i>
                                添加到购物车
                            </span>

                            <span id="collect-product" class="collect-product">
                                {{#if coled}}
                                    <i class="coled iconfont">&#xe616;</i>
                                    已收藏
                                {{^}}
                                    <i class="iconfont">&#xe616;</i>
                                    收藏商品
                                {{/if}}
                            </span>
                        </p>

                        <p class="share-row">
                            <span class="title pull-left">分享商品:</span>
                            <span class="share-wrapper pull-left clearfix">
                                <i class="weibo" data-type="weibo" title="分享到新浪微博"></i>
                                <i class="weixin" data-type="weixin" title="分享到微信朋友圈"></i>
                                <i class="qweibo" data-type="qweibo" title="分享到腾讯微博"></i>
                                <i class="qzone" data-type="qzone" title="分享到QQ空间"></i>
                                <i class="qq" data-type="qq" title="分享到QQ好友"></i>
                                <i class="renren" data-type="renren" title="分享到人人"></i>
                                <i class="douban" data-type="douban" class="分享到豆瓣"></i>
                            </span>
                        </p>
                    </div>
                </div>
            {{/ goodInfo}}

            <div class="other-infos">
                <div class="description-material info-block">
                    <p class="block-title">
                        <span class="title cur">商品信息 DESCRIPTION</span>
                        <span class="sep">|</span>
                        <span class="title">材质洗涤 MATERIALS</span>
                    </p>
                    <div class="description-content">
                        {{# description}}
                            <ul class="basic clearfix">
                                {{# basic}}
                                    <li>
                                        {{key}}: {{value}}
                                    </li>
                                {{/ basic}}
                            </ul>
                            {{#if comfort}}
                                <ul class="comfort clearfix">
                                    {{# comfort}}
                                        <li class="pull-left">
                                            <span class="comfort-title">{{name}}:</span>
                                            <span class="min-des">{{minDes}}</span>
                                            {{# blocks}}
                                                <span class="comfort-block {{#if cur}}cur{{/if}}"></span>
                                            {{/ blocks}}
                                            <span class="max-des">{{maxDes}}</span>
                                        </li>
                                    {{/ comfort}}
                                </ul>
                            {{/if}}
                        {{/ description}}
                    </div>
                    <div class="material-content hide">
                        {{# material}}
                            {{#if detail}}
                                <ul class="material-detail clearfix">
                                    {{# detail}}
                                        <li>
                                            <img src="{{img}}">
                                            <p class="name">{{name}}<br>{{enName}}</p>
                                            <p class="text">{{text}}</p>
                                        </li>
                                    {{/ detail}}
                                </ul>
                            {{/if}}

                            {{#if wash}}
                                <ul class="wash">
                                    {{# wash}}
                                        <li>
                                            <img class="wash-icon" src="{{img}}">
                                            <p class="wash-name">{{name}}</p>
                                        </li>
                                    {{/ wash}}
                                </ul>
                            {{/if}}
                        {{/ material}}
                    </div>
                </div>
            </div>
        </div>
    {{/ detail}}
</div>
{{> layout/footer}}