Files
screen-oulun/src/components/header.vue

83 lines
1.7 KiB
Vue
Raw Normal View History

2025-07-09 10:22:14 +08:00
<template>
<div class="n_header">
<div class="n_header_h1">
<slot></slot>
<h1 v-if="type === '1'">{{ title1 }}</h1>
</div>
<p class="p_title">{{ title2 }}</p>
<div class="exit_btn iconfont" @click="back">&#xe85b;</div>
</div>
</template>
<script>
export default {
name: 'Header',
data () {
return {}
},
props: {
type: String,
title1: String,
title2: String
},
methods: {
back () {
let flag = !!(document.fullscreenElement || document.mozFullscreenElement || document.webkitFullscreenElement || document.msFullscreenElement)
if (flag) {
if (document.exitFullscreen) {
document.exitFullscreen()
} else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen()
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen()
} else if (document.msExitFullscreen) {
document.msExitFullscreen()
}
}
this.$router.push('/setup')
}
}
}
</script>
<style lang="stylus" scoped>
.n_header
position absolute
left 0
top 0
width 100%
height 88px
background center / 100% url('../images/header_bg_s.png') no-repeat
.n_header_h1
width: 100%;
height: 100%;
// padding-top 12px
text-align center
h1
font-size: 19px;
font-weight: 700;
color: #fff;
line-height: 40px;
height: 40px;
text-align center;
letter-spacing 3px
padding-left 3px
.p_title
position absolute
left 1%
top 11%
font-size 14px
color #AECAF5
.exit_btn
position absolute
right 1%
top 11%
z-index 100
height 16px
width 16px
line-height 16px
font-size 16px
color #AECAF5
text-align center
</style>