You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
80 lines
1.7 KiB
80 lines
1.7 KiB
<template>
|
|
<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>
|
|
</router-link>
|
|
<a class="service" href="/mall/web/appoint_index">
|
|
<img src="../assets/images/icon/server.png" />
|
|
<span>服务</span>
|
|
</a>
|
|
<a class="user-center" href="/mall/web/owner">
|
|
<img src="../assets/images/icon/my.png" />
|
|
<span>我的</span>
|
|
</a>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {};
|
|
</script>
|
|
|
|
<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;
|
|
}
|
|
}
|
|
.service {
|
|
img {
|
|
width: 0.45rem;
|
|
height: 0.39rem;
|
|
}
|
|
}
|
|
.user-center {
|
|
img {
|
|
width: 0.36rem;
|
|
height: 0.46rem;
|
|
}
|
|
}
|
|
.active {
|
|
span {
|
|
color: #29b079;
|
|
}
|
|
}
|
|
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;
|
|
}
|
|
}
|
|
}
|
|
// .router-bottom .router-bottom a .router-bottom a .router-bottom a.active {
|
|
// color: #29b079;
|
|
// }
|
|
</style>
|