list.phtml 14.3 KB
{{> layout/header}}
<div class="products-page yoho-page">
    {{# products}}
        {{> layout/path-nav}}
        <div class="filter-box">
            {{# filters}}
                {{# checkedConditions}}
                    <div class="checked-conditions section">
                        <span class="title">已选条件:</span>

                        <div class="attr-content clearfix">
                            {{#each conditions}}
                                <a class="tag" href="{{href}}">
                                    {{#if name}}
                                        {{name}}
                                    {{^}}
                                        <i class="color-block" style="background: {{color}}"></i>
                                    {{/if}}
                                    <i class="close iconfont">&#xe602;</i>
                                </a>
                            {{/each}}

                            <a class="clear-checked" href="{{clearUrl}}">清空筛选条件</a>
                        </div>
                    </div>
                {{/ checkedConditions}}

                {{#if channel}}
                    <div class="channel section">
                        <span class="title">频道:</span>

                        <div class="attr-content clearfix">
                            {{#each channel}}
                                <a class="attr" href="{{href}}">
                                    {{name}}
                                </a>
                            {{/each}}
                        </div>
                    </div>
                {{/if}}

                {{#if sort}}
                    <div class="sort section">
                        <span class="title">分类:</span>

                        <div class="attr-content">
                            <ul class="sort-pre clearfix">
                                {{#each sort}}
                                    <li>
                                        <span class="attr">
                                            {{name}}
                                        </span>
                                    </li>
                                {{/each}}
                            </ul>

                            <div class="sort-sub-wrap">
                                {{#each sort}}
                                    <ul class="sort-sub clearfix hide">
                                        {{#each sub}}
                                            <li class="attr">
                                                <a href="{{href}}">{{name}}</a>
                                            </li>
                                        {{/each}}
                                    </ul>
                                {{/each}}
                            </div>
                        </div>
                    </div>
                {{/if}}

                {{# brand}}
                    <div class="brand section">
                        <span class="title">品牌:</span>

                        <div class="attr-content">
                            <ul class="default clearfix">
                                {{# default}}
                                    <li class="attr">
                                        <a href="{{href}}" title="{{name}}">{{name}}</a>
                                    </li>
                                {{/ default}}
                            </ul>

                            <div class="brand-opt">
                                <span id="brand-more" class="brand-more">
                                    <em>更多</em>
                                    <i class="iconfont">&#xe600;</i>
                                </span>
                                
                                <span id="brand-multi" class="multi-select">多选 +</span>
                            </div>

                            <div class="brand-panel hide">
                                <div class="panel-head clearfix">
                                    <p class="brands-index">
                                        {{#each brandIndex}}
                                            <span data-index="{{index}}">{{name}}</span>
                                        {{/each}}
                                    </p>

                                    <div class="brand-search">
                                        <input id="brand-search-input" type="text">
                                        <span class="btn">
                                            <i class="iconfont">&#xe611;</i>
                                        </span>
                                    </div>
                                </div>

                                <ul class="panel-body check-container clearfix">
                                    {{# brandsShow}}
                                        <li class="attr" data-index="{{index}}" data-key="{{key}}">
                                            <a href="{{href}}">
                                                <span class="iconfont checkbox" data-id="{{id}}">&#xe613;</span>
                                                <span title="{{name}}">{{name}}</span>
                                            </a>
                                        </li>
                                    {{/ brandsShow}}
                                </ul>

                                <div class="btns">
                                    <button id="brand-multi-ok" class="multi-select-ok dis">确定</button>
                                    <button class="multi-select-cancel">取消</button>
                                </div>
                            </div>
                        </div>
                    </div>
                {{/ brand}}

                {{#if price}}
                    <div class="price section">
                        <span class="title">价格:</span>

                        <div class="attr-content clearfix">
                            {{# price}}
                                <a class="attr" href="{{href}}"{{name}}</a>
                            {{/ price}}

                            <div class="ud-price-range">
                                ¥
                                <input type="text" class="min limit">
                                <span class="price-sep">-</span>
                                <input type="text" class="max limit">

                                <button class="price-sure hide">确定</button>
                            </div>
                        </div>
                    </div>
                {{/if}}

                {{#if color}}
                    <div class="color section">
                        <span class="title">颜色:</span>
                        
                        <div class="attr-content clearfix">
                            {{# color}}
                                <a class="attr" href="{{href}}">
                                    <i class="color-block" style="background: {{rgb}}"></i>
                                    {{name}}
                                </a>
                            {{/ color}}
                        </div>
                    </div>
                {{/if}}

                {{#if size}}
                    <div class="size section">
                        <span class="title">尺码:</span>

                        <div class="attr-content clearfix">
                            {{# size}}
                                <a class="attr" href="{{href}}">{{name}}</a>
                            {{/ size}}
                        </div>
                    </div>
                {{/if}}

                {{#if seniorChose}}
                    <div class="senior section">
                        <span class="title">高级选项:</span>

                        <div class="attr-content">
                            <ul class="clearfix senior-attr-wrap">
                                {{#each seniorChose}}
                                    <li class="attr">
                                        {{name}}
                                        <span class="iconfont">&#xe600;</span>

                                        <div class="senior-up-icon"></div>
                                    </li>
                                {{/each}}
                            </ul>

                            <div class="senior-sub-wrap">
                                {{#each seniorChose}}
                                    <div class="senior-sub hide" data-attr="{{attr}}">
                                        {{#if showMulti}}
                                            <span class="multi-select">多选 +</span>
                                        {{/if}}
                                        <ul class="clearfix check-container">
                                            {{#each sub}}
                                                <li class="attr">
                                                    <a href="{{href}}">
                                                        <span class="iconfont checkbox" data-id="{{id}}">&#xe613;</span>
                                                        <span>{{name}}</span>
                                                    </a>
                                                </li>
                                            {{/each}}
                                        </ul>
                                        <div class="btns">
                                            <button class="multi-select-ok dis">确定</button>
                                            <button class="multi-select-cancel">取消</button>
                                        </div>
                                    </div>
                                {{/each}}
                            </div>
                        </div>
                    </div>
                {{/if}}
            {{/ filters}}
        </div>

        <div class="opt-banner">
            {{# opts}}
                {{# sortType}}
                    <a class="sort-type{{#if active}} active{{/if}}" href="{{href}}">
                        {{name}}
                        {{#if hasSortOrient}}
                            {{#if active}}
                                {{#if desc}}
                                    <span class="active-icon iconfont">&#xe603;</span>
                                {{^}}
                                    <span class="active-icon iconfont">&#xe604;</span>
                                {{/if}}
                            {{^}}
                                <span class="iconfont">&#xe614;</span>
                            {{/if}}
                        {{^}}
                            <span class="iconfont">&#xe604;</span>
                        {{/if}}
                    </a>
                {{/ sortType}}

                {{# checks}}
                    <a class="checks{{#if checked}} checked{{/if}}" href="{{href}}">
                        {{#if checked}}
                            <span class="iconfont">&#xe612;</span>
                        {{^}}
                            <span class="iconfont">&#xe613;</span>
                        {{/if}}
                        {{name}}
                    </a>
                {{/ checks}}

                <div class="pager-wrap">
                    {{#if fivePerLine}}
                        <div class="line-count active">
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                        </div>

                        <a class="line-count" href="{{sixPerLineHref}}">
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                        </a>
                    {{^}}
                        <a class="line-count" href="{{fivePerLineHref}}">
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                        </a>

                        <div class="line-count active">
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                        </div>
                    {{/if}}

                    <div class="page-count">
                        <span id="count-per-page">
                            {{countPerPage}}
                            <i class="iconfont">&#xe604;</i>
                        </span>
                        每页
                        <ul>
                            {{# pageCounts}}
                                <li>
                                    <a href="{{href}}">{{count}}</a>
                                </li>
                            {{/ pageCounts}}
                        </ul>
                    </div>

                    <p class="pager">
                        {{#if preHref}}
                            <a href="{{preHref}}">
                                <span class="iconfont">&#xe615;</span>
                            </a>
                        {{^}}
                            <span class="dis-icon iconfont">&#xe615;</span>
                        {{/if}}

                        <span>
                            <i>{{curPage}}</i>/{{pageCount}}
                        </span>

                        {{#if nextHref}}
                            <a href="{{nextHref}}">
                                <span class="iconfont">&#xe601;</span>
                            </a>
                        {{^}}
                            <span class="dis-icon iconfont">&#xe601;</span>
                        {{/if}}
                    </p>
                </div>
            {{/opts}}
        </div>

        <div class="goods-container clearfix{{#if opts.sixPerLine}} six-per-line{{/if}}">
            {{#each goods}}
                {{> product/good}}
            {{/each}}
        </div>
    {{/ products}}
</div>
{{> layout/footer}}