109 lines
2.3 KiB
Vue
109 lines
2.3 KiB
Vue
<template>
|
|
<header class="dataBoardHeader">
|
|
<div class='topTitle'></div>
|
|
<!-- <div class='time-chsoose'>
|
|
<span class='title'>时间选择</span>
|
|
<span class='time-show'>{{time}}</span>
|
|
<el-date-picker
|
|
v-model="time"
|
|
type="date"
|
|
value-format='yyyy-MM-dd'
|
|
:clearable='false'
|
|
style='position: absolute;right: 0px;width: 119px;top:-2px;opacity: 0;'
|
|
>
|
|
</el-date-picker>
|
|
</div> -->
|
|
<div
|
|
type="text"
|
|
class="screen-btn"
|
|
:title="isFullScreen?'退出全屏':'全屏'"
|
|
@click="changeFullScreen"
|
|
>
|
|
<svg-icon v-if="isFullScreen" icon-class="unFullScreenView" />
|
|
<svg-icon v-else icon-class="fullScreenView" />
|
|
</div>
|
|
</header>
|
|
</template>
|
|
|
|
<script>
|
|
// import moment from 'moment'
|
|
export default {
|
|
name: 'DataBoardHeader',
|
|
props: {
|
|
isFullScreen: {
|
|
type: Boolean,
|
|
default: () => {
|
|
return false
|
|
}
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
// time: moment().format('YYYY-MM-DD')
|
|
}
|
|
},
|
|
computed: {},
|
|
methods: {
|
|
changeFullScreen() {
|
|
this.$emit('screenfullChange')
|
|
},
|
|
exportPDF() {
|
|
this.$emit('exportPDF')
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.dataBoardHeader {
|
|
background: url('../../../../assets/images/dataBoard/head.png') no-repeat;
|
|
height: 99px;
|
|
background-size: 100%;
|
|
background-position: 0 0;
|
|
position: relative;
|
|
.topTitle{
|
|
width: 465px;
|
|
height: 77px;
|
|
background: url('../../../../assets/images/dataBoard/data-board-title.png') no-repeat;
|
|
background-size: 100%;
|
|
position: absolute;
|
|
left: 731px;
|
|
top:19px;
|
|
}
|
|
.time-chsoose {
|
|
width: 212px;
|
|
height: 33px;
|
|
background: url('../../../../assets/images/dataBoard/time-choose.png') no-repeat;
|
|
background-size: 100%;
|
|
position: absolute;
|
|
right: 63px;
|
|
top:49px;
|
|
.title {
|
|
font-size: 18px;
|
|
color: #082049;
|
|
letter-spacing: 1px;
|
|
position: relative;
|
|
top: 4px;
|
|
left: 8px
|
|
}
|
|
.time-show {
|
|
font-size: 18px;
|
|
color: #FFFFFF;
|
|
line-height: 18px;
|
|
position: relative;
|
|
top: 4px;
|
|
left: 28px;
|
|
}
|
|
}
|
|
.screen-btn{
|
|
color: #00fff0;
|
|
height: 32px;
|
|
line-height: 32px;
|
|
font-size: 32px;
|
|
position: absolute;
|
|
right: 22px;
|
|
top:47px;
|
|
}
|
|
}
|
|
</style>
|