|
|
|
@ -1,6 +1,6 @@ |
|
|
|
<template> |
|
|
|
<div class="router-bottom"> |
|
|
|
<router-link class="home" :class="{active:$route.name=='首页'}" to="/home"> |
|
|
|
<!-- <div class="router-bottom"> |
|
|
|
<router-link class="home" :class="{active:$route.name=='首页'}" to="/home"> |
|
|
|
<img v-if="$route.name!='首页'" src="../assets/images/icon/home.png" /> |
|
|
|
<img v-else src="../assets/images/icon/home-s.png"> |
|
|
|
<span>首页</span> |
|
|
|
@ -14,6 +14,40 @@ |
|
|
|
<span>我的</span> |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
<a class="home" href="https://shop43873935.youzan.com/v2/home/c2UG7vzR10?kdt_id=43681767&scan=3&from=groupmessage"> |
|
|
|
<img src="../assets/images/icon/home-s.png" /> |
|
|
|
<span>首页</span> |
|
|
|
</a> |
|
|
|
|
|
|
|
<a class="service" href="http://test.yihaojiazheng.cn/mall/web/appoint_index"> |
|
|
|
<img src="../assets/images/icon/server.png" /> |
|
|
|
<span>服务</span> |
|
|
|
</a> |
|
|
|
<a class="user-center" href="http://test.yihaojiazheng.cn/mall/web/owner"> |
|
|
|
<img src="../assets/images/icon/my.png" /> |
|
|
|
<span>我的</span> |
|
|
|
</a> |
|
|
|
</div> --> |
|
|
|
|
|
|
|
<div class="cap-shop-nav safe-padding cap-shop-nav--1"> |
|
|
|
<div class="cap-wechat-nav"><a href="https://h5.youzan.com/wscshop/showcase/homepage?kdt_id=43681767" class="cap-wechat-nav__home"> |
|
|
|
<img src="../assets/images/icon/home-s.png" style="height:15px;width:15px" /></a> |
|
|
|
<ul class="cap-wechat-nav__items cap-wechat-nav__items--3"> |
|
|
|
<li class="cap-wechat-nav__item"><a href="https://h5.youzan.com/v2/im?c=wsc&v=2&kdt_id=43681767#talk!id=43681767&sf=wx_menu" class="cap-wechat-nav__link"> |
|
|
|
在线客服 |
|
|
|
</a> |
|
|
|
</li> |
|
|
|
<li class="cap-wechat-nav__item"><a href="http://www.yihaojiazheng.cn/mall/web/appoint_index" class="cap-wechat-nav__link"> |
|
|
|
预约服务 |
|
|
|
</a> |
|
|
|
</li> |
|
|
|
<li class="cap-wechat-nav__item"><a href="http://www.yihaojiazheng.cn/mall/web/owner" class="cap-wechat-nav__link"> |
|
|
|
个人中心 |
|
|
|
</a> |
|
|
|
</li> |
|
|
|
</ul> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
@ -22,59 +56,115 @@ export default {}; |
|
|
|
|
|
|
|
<style lang="scss"> |
|
|
|
.router-bottom { |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
padding: 0 1rem; |
|
|
|
box-sizing: border-box; |
|
|
|
border-top: 1px solid #ddd; |
|
|
|
z-index: 1000; |
|
|
|
bottom: 0; |
|
|
|
left: 0; |
|
|
|
.home { |
|
|
|
img { |
|
|
|
width: 0.46rem; |
|
|
|
height: 0.44rem; |
|
|
|
} |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
padding: 0 1rem; |
|
|
|
box-sizing: border-box; |
|
|
|
border-top: 1px solid #ddd; |
|
|
|
z-index: 1000; |
|
|
|
bottom: 0; |
|
|
|
left: 0; |
|
|
|
.home { |
|
|
|
img { |
|
|
|
width: 0.46rem; |
|
|
|
height: 0.44rem; |
|
|
|
} |
|
|
|
} |
|
|
|
.service { |
|
|
|
img { |
|
|
|
width: 0.45rem; |
|
|
|
height: 0.39rem; |
|
|
|
} |
|
|
|
.service { |
|
|
|
img { |
|
|
|
width: 0.45rem; |
|
|
|
height: 0.39rem; |
|
|
|
} |
|
|
|
} |
|
|
|
.user-center { |
|
|
|
img { |
|
|
|
width: 0.36rem; |
|
|
|
height: 0.46rem; |
|
|
|
} |
|
|
|
.user-center { |
|
|
|
img { |
|
|
|
width: 0.36rem; |
|
|
|
height: 0.46rem; |
|
|
|
} |
|
|
|
} |
|
|
|
.active { |
|
|
|
span { |
|
|
|
color: #29b079; |
|
|
|
} |
|
|
|
.active { |
|
|
|
span { |
|
|
|
color: #29b079; |
|
|
|
} |
|
|
|
} |
|
|
|
a { |
|
|
|
list-style: none; |
|
|
|
color: #999999; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
align-items: center; |
|
|
|
img { |
|
|
|
margin-bottom: 0.09rem; |
|
|
|
} |
|
|
|
a { |
|
|
|
list-style: none; |
|
|
|
color: #999999; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
align-items: center; |
|
|
|
img { |
|
|
|
margin-bottom: 0.09rem; |
|
|
|
} |
|
|
|
span { |
|
|
|
line-height: 1; |
|
|
|
// height: 0.2rem; |
|
|
|
font-size: 0.2rem; |
|
|
|
font-weight: 400; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
span { |
|
|
|
line-height: 1; |
|
|
|
// height: 0.2rem; |
|
|
|
font-size: 0.2rem; |
|
|
|
font-weight: 400; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
// .router-bottom .router-bottom a .router-bottom a .router-bottom a.active { |
|
|
|
// color: #29b079; |
|
|
|
// } |
|
|
|
|
|
|
|
.cap-shop-nav { |
|
|
|
position: fixed; |
|
|
|
bottom: 0; |
|
|
|
left: 0; |
|
|
|
right: 0; |
|
|
|
z-index: 99; |
|
|
|
} |
|
|
|
|
|
|
|
.cap-shop-nav--1 { |
|
|
|
height: 49px; |
|
|
|
background-color: #fafafa; |
|
|
|
} |
|
|
|
|
|
|
|
.cap-shop-nav { |
|
|
|
z-index: 141; |
|
|
|
} |
|
|
|
|
|
|
|
.cap-wechat-nav__home { |
|
|
|
position: absolute; |
|
|
|
width: 43px; |
|
|
|
line-height: 49px; |
|
|
|
text-align: center; |
|
|
|
color: #666; |
|
|
|
font-size: 18px; |
|
|
|
} |
|
|
|
|
|
|
|
.cap-wechat-nav__items { |
|
|
|
margin-left: 43px; |
|
|
|
list-style: none; |
|
|
|
} |
|
|
|
|
|
|
|
.cap-wechat-nav__items--3 .cap-wechat-nav__item { |
|
|
|
width: 33.3333%; |
|
|
|
} |
|
|
|
|
|
|
|
.cap-wechat-nav__item { |
|
|
|
float: left; |
|
|
|
line-height: 49px; |
|
|
|
-moz-box-sizing: border-box; |
|
|
|
box-sizing: border-box; |
|
|
|
position: relative; |
|
|
|
color: #4b4b4b; |
|
|
|
border-left: 1px solid #f3f3f3; |
|
|
|
} |
|
|
|
|
|
|
|
.cap-wechat-nav__link { |
|
|
|
font-size: 14px; |
|
|
|
color: #4b4b4b; |
|
|
|
display: block; |
|
|
|
text-align: center; |
|
|
|
-webkit-tap-highlight-color: transparent; |
|
|
|
overflow: hidden; |
|
|
|
text-overflow: ellipsis; |
|
|
|
white-space: nowrap; |
|
|
|
} |
|
|
|
</style> |