101 lines
2.1 KiB
Vue
101 lines
2.1 KiB
Vue
<!--
|
||
filename: index.vue
|
||
author: liubin
|
||
date: 2023-10-11 09:32:04
|
||
description: 设备看板
|
||
-->
|
||
|
||
<template>
|
||
<div ref="dataBoard" class="data-board">
|
||
<el-button type="text" @click="goback" class="go-back--btn">返回</el-button>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'DataBoard',
|
||
components: {},
|
||
props: {},
|
||
data() {
|
||
return {
|
||
appMain: null, // dom
|
||
parentStyle: {
|
||
margin: '8px 14px 0px 16px',
|
||
minHeight: 'calc(100vh - 120px - 8px)',
|
||
}, // object
|
||
mainFooter: null, // dom
|
||
};
|
||
},
|
||
// mounted() {
|
||
// this.$nextTick(() => {
|
||
// this.modify();
|
||
// });
|
||
// },
|
||
// activated() {
|
||
// this.modify();
|
||
// },
|
||
// deactivated() {
|
||
// this.recover();
|
||
// },
|
||
// beforeDestroy() {
|
||
// this.recover();
|
||
// },
|
||
methods: {
|
||
// modify() {
|
||
// // 在这个页面临时修改下父类的margin，结束时需还原
|
||
// this.appMain = document.querySelector('.app-main');
|
||
// // this.appMain.style.minHeight = 'calc(100vh - 90px)';
|
||
// this.appMain.style.margin = 0;
|
||
// // 在这个页面临时删除 main-footer 元素，结束时需还原
|
||
// // this.mainFooter = document.querySelector('.main-footer').cloneNode(true);
|
||
// // document.querySelector('.main-footer').remove();
|
||
// this.$refs.dataBoard.classList.add('data-board');
|
||
// },
|
||
// recover() {
|
||
// this.$refs.dataBoard.classList.remove('data-board');
|
||
// this.$nextTick(() => {
|
||
// this.appMain.style.margin = this.parentStyle.margin;
|
||
// // this.appMain.style.minHeight = this.parentStyle.minHeight;
|
||
// // this.appMain.insertAdjacentElement('afterend', this.mainFooter);
|
||
// });
|
||
// },
|
||
goback() {
|
||
this.$router.go(-1);
|
||
}
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.data-board {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
background: url('../../../assets/images/DataBoard.png') 100% 100% / contain
|
||
no-repeat;
|
||
}
|
||
|
||
.go-back--btn {
|
||
position: fixed;
|
||
top: 28px;
|
||
left: 24px;
|
||
color: #fff;
|
||
font-size: 18px;
|
||
letter-spacing: 6px;
|
||
|
||
&:hover {
|
||
text-decoration: underline;
|
||
}
|
||
|
||
&::after {
|
||
content: "\2BAA";
|
||
position: absolute;
|
||
top: 6px;
|
||
right: -26px;
|
||
font-size: 24px;
|
||
}
|
||
}
|
||
</style>
|