90 lines
1.4 KiB
Vue
90 lines
1.4 KiB
Vue
<template>
|
|
<header class="one-header">
|
|
<h1>Baidu DLS</h1>
|
|
<a
|
|
href="http://dls.baidu.com/"
|
|
target="_blank"
|
|
>返回 DLS</a>
|
|
<veui-dropdown
|
|
label="Vue"
|
|
:options="options"
|
|
@click="redirect"
|
|
/>
|
|
</header>
|
|
</template>
|
|
|
|
<script>
|
|
import { Dropdown } from 'veui'
|
|
|
|
export default {
|
|
name: 'one-header',
|
|
components: {
|
|
'veui-dropdown': Dropdown
|
|
},
|
|
data () {
|
|
return {
|
|
options: [
|
|
{
|
|
label: 'Vue',
|
|
value: '/'
|
|
},
|
|
{
|
|
label: 'React',
|
|
value: 'http://one-ui.baidu-int.com/'
|
|
},
|
|
{
|
|
label: 'Angular',
|
|
value: 'http://cp01-wangfengjiao01.epc.baidu.com:8404/'
|
|
}
|
|
]
|
|
}
|
|
},
|
|
methods: {
|
|
redirect (url) {
|
|
location.href = url
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="stylus" scoped>
|
|
.one-header
|
|
position fixed
|
|
top 0
|
|
left 0
|
|
right 0
|
|
z-index 20
|
|
display flex
|
|
align-items center
|
|
height 60px
|
|
background-color #070628
|
|
color #ffffff
|
|
padding 0 51px 0 17px
|
|
|
|
h1
|
|
display inline-block
|
|
font-size 18px
|
|
|
|
a
|
|
margin-left auto
|
|
color #ffffff
|
|
font-size 16px
|
|
|
|
&:hover
|
|
color #ffffff
|
|
|
|
.veui-dropdown
|
|
margin-left 40px
|
|
|
|
& >>> .veui-dropdown-button
|
|
color #ffffff
|
|
background-color transparent
|
|
border-radius 6px
|
|
height 28px
|
|
display inline-flex
|
|
align-items center
|
|
|
|
.veui-dropdown-label
|
|
line-height 1
|
|
</style>
|