56 lines
1.5 KiB
Vue
56 lines
1.5 KiB
Vue
|
<template>
|
||
|
|
<header>
|
||
|
|
<div class="tag_block clearfix">
|
||
|
|
<div class="fl">
|
||
|
|
<div v-if="index == '0'" class="tag cur_tag">首页</div>
|
||
|
|
<router-link v-else to="/homepage" class="tag">首页</router-link>
|
||
|
|
<div v-if="index == '1'" class="tag cur_tag">仓储监控</div>
|
||
|
|
<router-link v-else to="/storagemonitor" class="tag">仓储监控</router-link>
|
||
|
|
<div v-if="index == '2'" class="tag cur_tag">设备监控</div>
|
||
|
|
<router-link v-else to="/devicemonitor" class="tag">设备监控</router-link>
|
||
|
|
</div>
|
||
|
|
<div class="fr">
|
||
|
|
<div v-if="index == '3'" class="tag cur_tag">物流工艺</div>
|
||
|
|
<router-link v-else to="/logisticstech" class="tag">物流工艺</router-link>
|
||
|
|
<div v-if="index == '4'" class="tag cur_tag">生产统计</div>
|
||
|
|
<router-link v-else to="/prodcount" class="tag">生产统计</router-link>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</header>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
name: 'Header',
|
||
|
|
data () {
|
||
|
|
return {}
|
||
|
|
},
|
||
|
|
props: {
|
||
|
|
index: String
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="stylus" scoped>
|
||
|
|
@import '~@css/mixin'
|
||
|
|
header
|
||
|
|
_wh(100%, 84px)
|
||
|
|
overflow hidden
|
||
|
|
position relative
|
||
|
|
_bis('../assets/images/top.png',auto, 84px)
|
||
|
|
.tag_block
|
||
|
|
margin 35px .54rem 0
|
||
|
|
.tag
|
||
|
|
display inline-block
|
||
|
|
_wh(132px, 36px)
|
||
|
|
_font(16px, 36px)
|
||
|
|
_bis('../assets/images/tag_1.png')
|
||
|
|
cursor pointer
|
||
|
|
&:hover
|
||
|
|
color #32C5FF
|
||
|
|
_bis('../assets/images/tag_2.png')
|
||
|
|
.cur_tag
|
||
|
|
color #32C5FF
|
||
|
|
_bis('../assets/images/tag_2.png')
|
||
|
|
</style>
|