shop2.html 16.9 KB
<div class="tabheader">
    <ul class="nav nav-tabs">
      <li data-toggle="contentpanel-pc" class="active"><a href="#">店铺装修(PC端)</a></li>
      <li data-toggle="contentpanel-app"><a href="#">店铺装修(移动端)</a></li>
    </ul>
</div>

<div class="pageheader">
    <div class="media">
        <div class="pageicon pull-left">
            <i class="fa fa-th-list"></i>
        </div>
        <div class="media-body">
            <ul class="breadcrumb">
                <li><a href=""><i class="glyphicon glyphicon-home"></i></a></li>
                <li><a href="">店铺管理</a></li>
                <li>店铺装修管理</li>
            </ul>

            <div>
                <div class="col-sm-4">
                    <h4>选择模板</h4>
                </div>
                <div class="col-sm-8">
                    <label class="radio-inline"><input type="radio" name="brandLevel" value="1">基础模板</label>
                    <label class="radio-inline"><input type="radio" name="brandLevel" value="2">模板2</label>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="main" class="contentpanel"></div>

<!--pc单品牌-->
<div class="contentpanel contentpanel-pc contentpanel-pc-single" style="display: none">
    <div class="model-wrap">
        <!--banner-->
        <div class="model-banner model-editor"><img src="1.png"></div>
        <!--nav-->
        <div class="model-nav model-editor">
            <ul>
                <li><a href="#">店铺首页</a></li>
                <li><a href="#">全部商品</a></li>
                <li><a href="#">人气单品</a></li>
                <li><a href="#">新品上架</a></li>
            </ul>
        </div>

        <!--main-->
        <div class="model-main">
            <!--左侧main-->
            <div class="model-main-left">
                <!--商品列表-->
                <div class="sortList">
                    (固定内容!)
                    <ul>
                        <li><a href="#">上衣</a></li>
                        <li><a href="#">下衣</a></li>
                        <li><a href="#">鞋子</a></li>
                        <li><a href="#">男装</a></li>
                        <li><a href="#">女装</a></li>
                    </ul>
                </div>

                <!--经典推荐-->
                <div class="model-recommend model-typicRecommend model-editor">
                    <div class="recommendTitle">经典推荐</div>
                    <div class="recommendDetail typicRecommendDetail">
                        <ul>
                            <li><a href="#">军装大衣</a><img src="1.png"></li>
                            <li><a href="#">保暖军大衣</a><img src="1.png"></li>
                            <li><a href="#">Disneyskc</a><img src="1.png"></li>
                            <li><a href="#">耐克</a><img src="1.png"></li>
                            <li><a href="#">Alomar</a><img src="1.png"></li>
                        </ul>
                    </div>
                </div>

                <!--热门推荐-->
                <div class="model-recommend model-hotRecommend model-editor">
                    <div class="recommendTitle">热销推荐</div>
                    <div class="recommendDetail hotRecommendDetail">
                        <ul>
                            <li><a href="#"><img src="1.png"></a></li>
                            <li><a href="#"><img src="1.png"></a></li>
                        </ul>
                    </div>
                </div>
            </div>

            <!--右侧main-->
            <div class="model-main-right">
                <!--slide-->
                <div class="model-slide model-editor"><img src="1.png"></div>
                <!--资源位小图-->
                <div class="model-sourcePic">
                    <ul class="model-editor">
                        <li class="pic_2"><img src="2.png"></li>
                        <li class="pic_1"><img src="2.png"></li>
                    </ul>
                </div>
                <div class="clear"></div>

                <!--商品展示:新品上架-->
                <div class="model-show">
                    <div class="model-showTitle">
                        <div class="showName model-editor"><span>新品上架&nbsp;&nbsp;NEW</span></div>
                        <div class="showTab model-editor">
                            <a href="#">休闲裤</a>&nbsp;|&nbsp;
                            <a href="#">运动鞋</a>&nbsp;|&nbsp;
                            <a href="#">MORE</a>
                        </div>
                        <div class="clear"></div>
                    </div>

                    <div class="model-showDetail model-editor">
                        <ul>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                        </ul>
                        <div class="clear"></div>
                    </div>
                </div>

                <!--商品展示:人气单品-->
                <div class="model-show">
                    <div class="model-showTitle">
                        <div class="showName model-editor"><span>人气单品&nbsp;&nbsp;HOT</span></div>
                        <div class="showTab model-editor">
                            <a href="#">休闲裤</a>&nbsp;|&nbsp;
                            <a href="#">运动鞋</a>&nbsp;|&nbsp;
                            <a href="#">MORE</a>
                        </div>
                        <div class="clear"></div>
                    </div>

                    <div class="model-showDetail model-editor">
                        <ul>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                        </ul>
                        <div class="clear"></div>
                    </div>
                </div>
            </div>

            <div class="clear"></div>
        </div>
    </div>
</div>

<!--app单品牌-->
<div class="contentpanel contentpanel-app contentpanel-app-single" style="display: none">
    <div class="model-wrap">

        <!--banner-->
        <div class="model-banner"><img src="1.png"></div>

        <!--nav-->
        <div class="model-nav">
            <ul>
                <li class="active"><a href="#">首页</a></li>
                <li><a href="#">上新</a></li>
                <li><a href="#">人气</a></li>
                <li  style="border:0"><a href="#">全部商品</a></li>
                <div class="clear"></div>
            </ul>
        </div>

        <!--main-->
        <div class="model-main">

            <!--大图-->
            <div class="largePic"><a href="#"><img src="1.png"></a></div>

            <!--小图-->
            <div class="model-smallPic">
                <ul>
                    <li class="pic_2"><img src="2.png"></li>
                    <li class="pic_1"><img src="2.png"></li>
                </ul>
            </div>
            <div class="clear"></div>

            <!--热门品类-->
            <div class="sortList">
                <span>热门品类</span>
                <div class="tableBorder">
                    <table border="0" cellspacing="0" cellpadding="1">
                        <tr>
                            <td><img src="3.png"><a href="#">棉羽</a></td>
                            <td><img src="3.png"><a href="#">夹克</a></td>
                            <td><img src="3.png"><a href="#">卫衣</a></td>
                            <td class="noRightBorder"><img src="3.png"><a href="#">毛衣</a></td>
                        </tr>
                        <tr>
                            <td><img src="3.png"><a href="#">休闲裤</a></td>
                            <td><img src="3.png"><a href="#">牛仔裤</a></td>
                            <td><img src="3.png"><a href="#">鞋子</a></td>
                            <td class="noRightBorder"><img src="3.png"><a href="#">配饰</a></td>
                        </tr>
                    </table>
                    <div class="line"></div>
                </div>
            </div>
        </div>

        <!--人气单品-->
        <div class="model-show">
            <div class="showTitle">
                <span>人气单品</span>
                <a href="#">MORE</a>
            </div>

            <div class="model-showDetail">
                <ul>
                    <li><img src="3.png"><div class="shadow"><a href="#">商品名称</a><b>¥1790.00</b></div></li>
                    <li><img src="3.png"><div class="shadow"><a href="#">商品名称</a><b>¥1790.00</b></div></li>
                    <li><img src="3.png"><div class="shadow"><a href="#">商品名称</a><b>¥1790.00</b></div></li>
                    <li><img src="3.png"><div class="shadow"><a href="#">商品名称</a><b>¥1790.00</b></div></li>
                    <li><img src="3.png"><div class="shadow"><a href="#">商品名称</a><b>¥1790.00</b></div></li>
                    <li><img src="3.png"><div class="shadow"><a href="#">商品名称</a><b>¥1790.00</b></div></li>
                    <li><img src="3.png"><div class="shadow"><a href="#">商品名称</a><b>¥1790.00</b></div></li>
                    <li><img src="3.png"><div class="shadow"><a href="#">商品名称</a><b>¥1790.00</b></div></li>
                </ul>
                <div class="clear"></div>
            </div>
        </div>
    </div>
</div>

<!--pc端店铺模板-->
<script type="text/template" id="shopWeb-pc">

    <div class="model-wrap contentpanel-pc">
        <!--banner-->
        <div class="model-banner model-editor"><img src="[[resources.shopTopBanner.data.src]]"></div>

        <!--nav-->
        <div class="model-nav model-editor">
            <ul>
                <li><a href="#">店铺首页</a></li>
                <li><a href="#">全部商品</a></li>
                <li><a href="#">人气单品</a></li>
                <li><a href="#">新品上架</a></li>
            </ul>
        </div>

        <!--main-->
        <div class="model-main">
            <!--左侧main-->
            <div class="model-main-left">
                <!--商品列表-->
                <div class="sortList">
                    (固定内容!)
                </div>

                <!--经典推荐-->
                <div class="model-recommend model-typicRecommend model-editor">
                    <div class="recommendTitle">经典推荐</div>
                    <div class="recommendDetail typicRecommendDetail">
                        <ul>
                            <li><a href="#">军装大衣</a><img src="1.png"></li>
                            <li><a href="#">保暖军大衣</a><img src="1.png"></li>
                            <li><a href="#">Disneyskc</a><img src="1.png"></li>
                            <li><a href="#">耐克</a><img src="1.png"></li>
                            <li><a href="#">Alomar</a><img src="1.png"></li>
                        </ul>
                    </div>
                </div>

                <!--热门推荐-->
                <div class="model-recommend model-hotRecommend model-editor">
                    <div class="recommendTitle">热销推荐</div>
                    <div class="recommendDetail hotRecommendDetail">
                        <ul>
                            <li><a href="#"><img src="1.png"></a></li>
                            <li><a href="#"><img src="1.png"></a></li>
                        </ul>
                    </div>
                </div>
            </div>

            <!--右侧main-->
            <div class="model-main-right">
                <!--slide-->
                <div class="model-slide model-editor"><img src="1.png"></div>
                <!--资源位小图-->
                <div class="model-sourcePic">
                    <ul class="model-editor">
                        [[each resources.oneRowTwoColImages.data as item _index]]
                        <li><img src="[[item.src]]"></li>
                        [[/each]]
                    </ul>
                </div>
                <div class="clear"></div>

                <!--商品展示:新品上架-->
                <div class="model-show">
                    <div class="model-showTitle">
                        <div class="showName model-editor"><span>新品上架&nbsp;&nbsp;NEW</span></div>
                        <div class="showTab model-editor">
                            <a href="#">休闲裤</a>&nbsp;|&nbsp;
                            <a href="#">运动鞋</a>&nbsp;|&nbsp;
                            <a href="#">MORE</a>
                        </div>
                        <div class="clear"></div>
                    </div>

                    <div class="model-showDetail model-editor">
                        <ul>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                        </ul>
                        <div class="clear"></div>
                    </div>
                </div>

                <!--商品展示:人气单品-->
                <div class="model-show">
                    <div class="model-showTitle">
                        <div class="showName model-editor"><span>人气单品&nbsp;&nbsp;HOT</span></div>
                        <div class="showTab model-editor">
                            <a href="#">休闲裤</a>&nbsp;|&nbsp;
                            <a href="#">运动鞋</a>&nbsp;|&nbsp;
                            <a href="#">MORE</a>
                        </div>
                        <div class="clear"></div>
                    </div>

                    <div class="model-showDetail model-editor">
                        <ul>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                            <li><img src="3.png"><a href="#">介绍内容介绍内容</a><b>¥600</b></li>
                        </ul>
                        <div class="clear"></div>
                    </div>
                </div>
            </div>

            <div class="clear"></div>
        </div>
    </div>
</script>