76 lines
1.9 KiB
Vue
76 lines
1.9 KiB
Vue
<template>
|
|
<div class="top_header">
|
|
<header>
|
|
<button class="fl iconfont back_icon" @click="goBack"></button>
|
|
<div class="fl header-title">{{navTitle}}</div>
|
|
<div class="fr date-box date-box_time">{{date}} {{week}} {{time}}</div>
|
|
</header>
|
|
<ul v-if="tabShow" class="tabs">
|
|
<li v-for="i in nav" :key="i.index">
|
|
<router-link :to="i.url" :class="{'router-link-active': i.url === $route.path}">{{i.title}}</router-link>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'Assignment',
|
|
props: {
|
|
tabShow: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
inner: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
navTitle: String,
|
|
nav: Array
|
|
},
|
|
data () {
|
|
return {
|
|
timer: null,
|
|
time: '',
|
|
date: '',
|
|
week: ''
|
|
}
|
|
},
|
|
mounted () {
|
|
this.timer = window.setInterval(this.updateTime, 1000)
|
|
},
|
|
methods: {
|
|
goBack () {
|
|
if (this.inner) {
|
|
this.$emit('goIn')
|
|
} else {
|
|
this.$router.push('/home')
|
|
}
|
|
},
|
|
updateTime () {
|
|
let cd = new Date()
|
|
let year = cd.getFullYear()
|
|
let month = cd.getMonth() + 1 < 10 ? '0' + (cd.getMonth() + 1) : cd.getMonth() + 1
|
|
let date = cd.getDate() < 10 ? '0' + cd.getDate() : cd.getDate()
|
|
let hh = cd.getHours() < 10 ? '0' + cd.getHours() : cd.getHours()
|
|
let mm = cd.getMinutes() < 10 ? '0' + cd.getMinutes() : cd.getMinutes()
|
|
let ss = cd.getSeconds() < 10 ? '0' + cd.getSeconds() : cd.getSeconds()
|
|
var weekday = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
|
|
let myddy = new Date().getDay()
|
|
let week = weekday[myddy]
|
|
this.time = `${hh}:${mm}:${ss}`
|
|
this.date = `${year}年${month}月${date}日`
|
|
this.week = `${week}`
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="stylus" scoped>
|
|
.top_header
|
|
div
|
|
color #ffffff
|
|
button
|
|
color #ffffff
|
|
</style>
|