caimei365-www/src/main/resources/templates/components/header.html

<header xmlns:th="http://www.w3.org/1999/xhtml">
    <!--顶部导航-->
    <div class="baseHeadTop">
        <ul class="wrap clear">
            <li>
                <a href="javascript:void(0);">采美365网</a>
                <div class="qrCode">
                    <img src="/img/base/qr_code_caimei.png" alt="采美365网"/>
                    <p>扫描关注</p>
                </div>
            </li>
            <li>
                <a href="javascript:void(0);">呵呵商城</a>
                <div class="qrCode">
                    <img src="/img/base/qr_code_hehe.png" alt="呵呵商城"/>
                    <p>扫描关注</p>
                </div>
            </li>
            <li>
                <a class="cTab" href="javascript:void(0);">用户名称</a>
                <div class="cShow">
                    <a href="javascript:void(0);">我的采美</a>
                    <a href="javascript:void(0);">机构资料</a>
                    <a href="javascript:void(0);">我的机构</a>
                    <a href="javascript:void(0);">店铺管理</a>
                    <a href="javascript:void(0);">我的订单</a>
                    <a href="javascript:void(0);">退出登录</a>
                </div>
            </li>
            <li><a href="javascript:void(0);">注册</a></li>
            <li><a href="javascript:void(0);">登录</a></li>
        </ul>
    </div>
    <!--搜索及购物车-->
    <div class="baseHeadCenter">
        <div class="wrap clear">
            <a href="javascript:void(0);" class="h5Only mClassBtn mIcon" title="分类"></a>
            <a href="/" class="logo">
                <img class="pcOnly" src="/img/base/logo.png" alt="采美 生美/医美采购服务平台"/>
                <img class="h5Only" src="/img/base/logo_m.png" alt="采美 生美/医美采购服务平台"/>
            </a>
            <div class="mf h5Only mUserCenter">
                <a href="javascript:void(0);" class="mAddCart mIcon" title="购物车"></a>
                <a href="javascript:void(0);" class="mUserIcon mIcon" title="个人中心"></a>
            </div>
            <div class="searchBox">
                <div class="search">
                    <div class="jqSelect">
                        <div class="pc">
                            <span data-select="1">供应商</span>
                            <ul><li data-id="1">供应商</li></ul>
                        </div>
                        <select>
                            <option value="0">产品</option>
                            <option value="1">供应商</option>
                            <option value="2">项目仪器</option>
                        </select>
                    </div>
                    <input class="keyword" type="text" placeholder="请输入关键字" />
                    <a class="searchBtn icon mIcon" href="javascript:void(0);"></a>
                </div>
                <!-- 热门搜索关键词 -->
                <div class="hotword">
                    <span th:each="word,wordStat: ${searchHotWord}">
                        <i th:if="${wordStat.index}>0">/</i>
                        <a th:href="@{/product/search.html( keyword=${word} )}" target="_blank" th:text="${word}"></a>
                    </span>
                </div>
            </div>
            <div class="headCart" id="headCart">
                <a href="javascript:void(0);" class="addBtn icon">购物车<em v-if="cartCount>0" v-text="'('+cartCount+')'"></em></a>
                <div id="cartData" class="cartData">
                    <div v-if="cartCount>0">
                        <ul class="cartMain">
                            <li class="cartItem" v-for="cart in cartList">
                                <a href="javascript:void(0)">
                                    <img :src="cart.image" >
                                    <span class="name" v-text="cart.name"></span>
                                    <span class="unit" v-text="'包装规格：'+cart.unit"></span>
                                    <span class="price" v-text="'￥'+parseFloat(cart.price).toFixed(2)"></span>
                                </a>
                                <span class="delBtn"></span>
                            </li>
                        </ul>
                        <div class="cartBtm">
                            <span>共计：<em v-text="productCount"></em> 件</span>
                            <span>合计：<em v-text="parseFloat(priceTotal).toFixed(2)"></em> 元</span>
                            <a class="btn" href="javascript:void(0)">去购物车结算</a>
                        </div>
                    </div>
                    <div v-else class="empty">
                        <img src="/img/base/empty_cart.png">
                        <p>购物车暂无商品</p>
                        <p>请先<a href="javascript:void(0);">登录</a>添加商品到购物车</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--商品分类及主导航菜单-->
    <div class="baseTopNav">
        <div class="wrap clear">
            <a class="classBtn nav" href="javascript:void(0);">商品分类</a>
            <a class="home nav" href="/">首页</a>
            <div class="navBox">
                <ul class="clear">
                    <!--导航菜单-->
                    <li th:each="menu: ${topMenuList}">
                        <a class="nav" href="javascript:void(0);" th:text="${menu.name}"></a>
                        <div th:if="${not #lists.isEmpty(menu.subMenus)}">
                            <a th:each="sub: ${menu.subMenus}" href="javascript:void(0);" th:text="${sub.name}"></a>
                        </div>
                    </li>
                </ul>
            </div>
            <a class="service nav" href="/">维修</a>
        </div>
        <div id="mainClassify" class="classifyBox">
            <template v-if="isPC">
                <div class="clsTab">
                    <template v-for="(big,i) in classify">
                        <a :class="{'on':i==0}" v-if="big.validFlag==1" :href="'/product/list.html?category='+big.bigTypeID+'-0-0'" v-text="big.name"></a>
                    </template>
                </div>
                <div class="clsCon">
                    <div class="tabItem" v-for="big in classify" :bid="big.bigTypeID">
                        <div class="line" v-for="small in big.smalltypeList" v-if="small.validFlag==1">
                            <div class="lft">
                                <a :href="'/product/list.html?category='+big.bigTypeID+'-'+small.smallTypeID+'-0'" v-text="small.name"></a>
                            </div>
                            <div class="rgt">
                                <template v-for="tiny in small.tinytypeList">
                                    <a v-if="tiny.validFlag==1" :href="'/product/list.html?category='+big.bigTypeID+'-'+small.smallTypeID+'-'+tiny.tinyTypeID" v-text="tiny.name"></a>
                                </template>
                            </div>
                        </div>
                    </div>
                </div>
            </template>
        </div>
    </div>
    <input type="hidden" th:value="${spiServer}" id="spiServer">
    <input type="hidden" th:value="${agent}" id="userAgent">
</header>