platform-b2c/src/main/webapp/resources/view/common/store_header.html

<style>
	body{
		font-family: "Microsoft Yahei", "微软雅黑";
	}
	#nav_fragment {
		margin-bottom: 20px;
	}

	#nav_fragment .shop-name {
		font-size: 24px;
		color: RGB(50,50,50);
	}

	#nav_fragment div#shop {
		width: 440px;
		padding: 5px;
	}

	#nav_fragment .shop-info {
		font-size: 12px;
		color: rgb(50,50,50);
	}

	#nav_fragment .shop-data {
		font-size: 12px;
		line-height: 25px;
		font-weight: 600;
		color: RGB(255,0,0);
	}

	#nav_fragment .btn-nav{
		width: 40px;
		height: 20px;
		line-height: 14px;
	}

	#nav_fragment .btn-nav .watch {
		font-size: 12px;
		color: white;
	}

	#nav_fragment .btn-nav .message {
		font-size: 12px;
		color: rgb(50,50,50);
	}

	#nav_fragment div.dropdown {
		margin-top: -5px;
		padding: 5px;
	}

	#nav_fragment .shop-contact {
		font-size: 14px;
		color: rgb(120,120,120);
		line-height: 25px;
	}

	#nav_fragment .shop-contact a{
		color: rgb(33,71,151);
	}

	#nav_fragment #search_input {
		height: 40px;
		font-size: 16px;
		font-family: '微软雅黑';
		border: 2px solid #5078cb;
		border-top-left-radius: 0px;
		border-bottom-left-radius: 0px;
		line-height: 40px;
	}

	#nav_fragment #search_input:focus {
		border-color: #5078cb;
		outline: 0;
		-webkit-box-shadow: none;
		box-shadow: none;
	}

	#nav_fragment #search_btn {
		background-color: #5078cb;
		color: rgb(255, 255, 255);
		font-size: 16px;
		width: 78px;
		height: 40px;
		border: 2px solid #5078cb;
		border-radius: 0;
	}

	#nav_fragment #search_btn_this {
		height: 36px;
		line-height: 36px;
		padding-top: 0px;
		padding-bottom: 0px;
		font-size: 16px;
		font-weight: 600;
		color: #5078cb;
		background: #fff;
		border-radius: 0;
		border: 1px #5078cb solid;
	}

	#nav_fragment .my-cart {
		margin-top: 20px;
		margin-left: 20px;
	}

	#nav_fragment .my-cart #my-cart{
		font-size: 14px;
		color: #5078cb;
	}

	#nav_fragment .my-cart .badge {
		background-color: #ff0000;
		position: absolute;
		top: -10px;
	}

	#nav_fragment .list-unstyled {
		list-style: none;
	}

	#nav_fragment a:hover,a:focus {
		text-decoration: none;
	}

	#nav_fragment .row>div {
		float: left;
	}

	#nav_fragment #shop {
		width: 100%;
		position: absolute;
		float: left;
	}

	#nav_fragment #search-group {
		padding-top: 20px;
		margin-left: 10px;
		padding-left: 20px;
		top: -12px;
		position: relative;
	}

	#nav_fragment #search-group .input-group {
		margin-right: 10px;
		float: left;
		width: 480px;
	}

	#nav_fragment .dropdown .dropdown-menu .dropdown-btn {
		float: left;
		margin-top: 30px;
	}

	#nav_fragment .dropdown .dropdown-score .description {
		padding-top: 10px;
		color: #323232;
		font-size: 12px;
	}

	#nav_fragment .dropdown .dropdown-score .score {
		display: inline-block;
		padding-top: 5px;
		color: #FF6868;
		font-size: 12px;
	}

	#nav_fragment .dropdown .dropdown-menu .dropdown-score>div>div {
		margin-top: 0px;
		width: 25px;
		margin-right: 10px;
	}

	#nav_fragment .shop-score {
		margin-top: 20px;
		margin-left: 70px;
	}

	#nav_fragment .shop-score>div>div {
		margin-right: 10px;
		width: 25px;
	}

	#nav_fragment .hot-search .active-search-item {
		color: #ff0101;
		font-size: 13px;
		display: inline-block;
		margin-right: 1em;
	}

	#nav_fragment .hot-search .resources {
		font-size: 12px;
		font-family: "Microsoft Yahei", "微软雅黑";
		color: rgb(250,50,50);
	}

	#nav_fragment .hot-search .hot-word {
		font-size: 12px;
		color: rgb(50,50,50);
		margin-left: 20px;
	}
	#nav_fragment .drop-down-active {
		z-index: 20;
		-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 2px rgba(210,209,209,.9);
		box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 2px rgba(210,209,209,.9);
		border: #f5f5f5 1px solid;
		background-color: white;
		transition: dispaly .5s ease;
	}
	.hot-search{
		margin-top: 5px;
	}
	.hot-search .static{
		color: #f00;
	}
	.hot-search a{
		color: #838383;
	}
	.hot-search a:hover{
		color: #f00;
	}
	.my-cart .btn{
		top: -8px;
		position: relative;
	}
	#search-group .association {
		position: absolute;
		left: 0;
		top: 100%;
		right: 61px;
		list-style: none;
		-webkit-padding-start: 0;
		background: #ffffff;
		border: 1px solid #dddddd;
		z-index: 21;
	}

	#search-group .association li {
		padding: 0 15px;
		line-height: 30px;
		text-align: left;
		font-family: "Microsoft Yahei";
	}

	#search-group .association li:hover {
		background: #EEEEEE;
		cursor: pointer;
	}
	.text-right{
		text-align: right;
	}
	.text-right a:hover{
		color: #d32526 !important;
		text-decoration: underline;
	}
	.icon-style img{
		vertical-align: top;
		position: relative;
		top: -9px;
	}
</style>
<div id="nav_fragment">
	<div class="container">
		<header></header>
		<div class="row" style="height: 120px; padding-top: 30px; margin: 0;" ng-controller="StoreHeaderCtrl">
			<!--&lt;!&ndash; 商城LOGO &ndash;&gt;
			<div style="width: 120px;">
				<a href="./" target="_blank">
					<img src="static/img/common/uas_mall.png" />
				</a>
			</div>-->
			<!-- 店铺信息以及下拉菜单 -->
			<div id = "shop" ng-class="{ 'drop-down-active' : isOpen }" ng-mouseleave="closeDropDown()">
				<div class="dropdown">
					<div style="width: 440px;">
						<!--<div class="dropdown-score" style="width: 90px;margin-right: 0; float: right;">
							<div class="row" style="margin: 0;">
								<div class="description">质量 <br/><span class="score">4.9</span></div>
								<div class="description">服务 <br/><span class="score">4.8</span></div>
								<div class="description">物流 <br/><span class="score">4.7</span></div>
							</div>
						</div>-->
						<div class="dropdown-btn" style="margin-top: 0;">
							<div style="margin-bottom: 15px;">
								<a role="button" class="dropdown-toggle" ng-mouseover="openDropDown()">
									<span class="shop-name" >{{storeInfo.storeName}}</span>
									<span><i class="fa fa-angle-down fa-fw" style="font-size: 20px;"></i></span>
								</a>
							</div>
							<div class="icon-style">
								<button class="btn btn-xs btn-danger btn-nav" ng-hide="isFocus" ng-click="focus(storeInfo.id, storeInfo.storeName)"><span class="watch">关注</span></button>
								<button class="btn btn-xs btn-default btn-nav" ng-show="isFocus" style="width:50px"><span>已关注</span></button>
								<!--<button class="btn btn-xs btn-default btn-nav"><span class="message">留言</span></button>-->
								<!--<button class="btn btn-xs btn-danger btn-nav" ng-if="storeInfo.type == 'ORIGINAL_FACTORY'"><span class="watch">原厂</span></button>
								<button class="btn btn-xs btn-primary btn-nav" ng-if="storeInfo.type == 'AGENCY'"><span class="watch">代理</span></button>
								<button class="btn btn-xs btn-success btn-nav" ng-if="storeInfo.type == 'DISTRIBUTION'"><span class="watch">经销</span></button>-->
								<span ng-if="storeInfo.type == 'ORIGINAL_FACTORY'">&nbsp;<img src="static/img/icon/icon-factory.png"/></span>
								<span ng-if="storeInfo.type == 'AGENCY'">&nbsp;<img src="static/img/icon/icon-agent.png"/></span>
								<span ng-if="storeInfo.type == 'DISTRIBUTION'">&nbsp;<img src="static/img/icon/icon-distribution.png"/></span>
								<span ng-if="storeInfo.type == 'CONSIGNMENT'">&nbsp;<img src="static/img/icon/consignment.png"/></span>
							</div>

						</div>
						<div class="clearfix"></div>
					</div>
					<div style="background: #FFFFFF;" ng-if="isOpen">
						<!-- 星星显示TODO -->
						<!--<ul class="list-unstyled" style=" border-bottom: 1px solid #eee;padding: 15px 0;">
							<li>
								<span class="shop-info">总订单量：</span><span class = "shop-data">暂无数据</span>
								&lt;!&ndash;<span class="shop-info">单</span>&ndash;&gt;
							</li>
							<li>
								<span class="shop-info">好评率：</span><span class = "shop-data">暂无数据</span>
							</li>
							<li>
								<span class="shop-info">产品质量：</span><span class = "shop-data">暂无数据</span>
							</li>
							<li>
								<span class="shop-info">服务态度：</span><span class = "shop-data">暂无数据</span>
							</li>
							<li>
								<span class="shop-info">物流速度：</span><span class = "shop-data">暂无数据</span>
							</li>
						</ul>-->
						<ul class = "shop-contact list-unstyled" style="padding: 15px 0; margin-bottom: 0; border-top: #e8e8e8 1px solid; margin-top: 20px;">
							<li ng-if="storeInfo.enterprise.enTel.length > 0">
								<span>电话：</span><span ng-bind="storeInfo.enterprise.enTel"></span>
							</li>
							<li ng-if="storeInfo.enterprise.enFax.length > 0">
								<span>传真：</span><span ng-bind="storeInfo.enterprise.enFax"></span>
							</li>
							<li ng-if="storeInfo.enterprise.enAddress.length > 0">
								<span>地址：</span><span ng-bind="storeInfo.enterprise.enAddress"></span>
							</li>
							<!--<li>
								<span>传真：</span><span ng-bind="storeInfo.enterprise.enFax || '空'"></span>
							</li>
							<li>
								<span>主代理：</span>
								&lt;!&ndash;<span ng-if="storeInfo.qualifications && storeInfo.qualifications.length > 0" ng-repeat="qualification in storeInfo.qualifications">{{qualification}}</span>&ndash;&gt;
								<span>空</span>
							</li>-->
							<li class="text-right">
								<a ng-href="{{ 'store/' + storeInfo.uuid + '#/description' }}">了解更多&gt;</a>
							</li>
						</ul>
					</div>
				</div>
			</div>

			<!-- 搜索框 -->
			<div id="search-group" style="margin-left: 450px;" ng-controller="SearchCtrl">
				<div style="width: 100%;">
					<div class="input-group">
						<input id="search_input" ng-model="keyword" ng-change="onChange()" type="text" class="form-control" placeholder="型号/类目/品牌" ng-search="search()" 							ng-focus="onFocus()" ng-blur="onBlur()" ng-keyup="onKeyup()" autocomplete="off"/>
						<span class="input-group-btn">
							<button type="button" class="btn" id="search_btn" ng-click="search()">&nbsp;搜&nbsp;索&nbsp;</button>
						</span>
						<ul class="association" ng-show="associate || associateEnter" ng-mouseenter="onAssociateEnter()"
							ng-mouseleave="onAssociateLeave()">
							<li ng-repeat="as in associates" ng-bind="as" ng-class="{'active': $index==selectIndex}"
								ng-click="onAssociateClick(as)"></li>
						</ul>
					</div>
					<div>
						<button type="button" class="btn" style="display: none;" id="search_btn_this" ng-click="search(this)">搜本店</button>
					</div>
					<div class="clearfix"></div>
				</div>
				<div class="hot-search">
					<ul class="list-untyled active-search-body" style="padding: 0;">
						<li class="active-search-item">热门搜索</li>
						<li class="active-search-item" ng-repeat="hw in hotwords"><a href="{{hw.url}}" ng-bind="hw.name"></a></li>
					</ul>
				</div>
			</div>

			<!-- 购物车按钮 -->
			<!-- <div class="my-cart">
				<a ng-href="{{rootPath + '/user#cart'}}">
					<button type="button" class="btn btn-default" id="btn-cart" ng-click="">
						<span id="my-cart">
							<i class="fa fa-shopping-cart fa-lg"></i>
							我的购物车
						</span>
						<span ng-bind="countCart || 0" class="badge">0</span>
					</button>
				</a>
			</div> -->
		</div>
	</div>
</div>