<template>
|
<div id="pageCont" class="dark-page">
|
<div class="btns">
|
<dv-decoration-11 :color="lineColor" @click="goBack()">
|
<div color-green font-600 bg="~ dark/0">
|
返回
|
</div>
|
</dv-decoration-11>
|
</div>
|
<dv-decoration7 :color="lineColor" style="width:100%;height:6%;margin-bottom: 20px">
|
<div class="msgTit">
|
{{title}}
|
</div>
|
</dv-decoration7>
|
<dv-border-box1 :color="lineColor" style="width: 100%;height: calc(100% - 20px)">
|
|
</dv-border-box1>
|
</div>
|
</template>
|
|
<script lang="ts">
|
import screenfull from 'screenfull';
|
import { toRefs, reactive, ref, onMounted, defineComponent, defineAsyncComponent, nextTick, onUnmounted } from 'vue';
|
import { ElTable } from 'element-plus';
|
import { FormInstance, FormRules, ElMessage } from 'element-plus';
|
import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent/index.ts';
|
import { useRoute } from 'vue-router';
|
import {hiddenReportApi} from "/@/api/doublePreventSystem/report";
|
import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice/index.ts';
|
import '/@/theme/bigScreen.css'
|
import {useScreenTheme} from "/@/stores/screenTheme"
|
import {storeToRefs} from "pinia";
|
|
// 定义接口来定义对象的类型
|
interface stateType {
|
lineColor: Array<string>,
|
title: string | null
|
}
|
export default defineComponent({
|
name: 'msgDetail',
|
components: {
|
|
},
|
setup() {
|
const screenThemes = useScreenTheme()
|
const { screenTheme } = storeToRefs(screenThemes);
|
const route = useRoute();
|
const state = reactive<stateType>({
|
lineColor: ['#11FEEE'],
|
title: ''
|
});
|
|
// 页面载入时执行方法
|
onMounted(() => {
|
if (route.query.row) {
|
state.title = route.query.row[1]
|
}
|
getTheme()
|
});
|
|
|
|
const getTheme =()=>{
|
if(screenTheme.value.isDark){
|
window.document.getElementById('pageCont').setAttribute( "class", 'dark-page' );
|
state.lineColor = ['#11FEEE']
|
}else{
|
window.document.getElementById('pageCont').setAttribute( "class", 'light-page' );
|
state.lineColor = ['#333','#ccc']
|
}
|
}
|
|
// 返回上一页
|
const goBack = () => {
|
window.history.go(-1);
|
};
|
|
|
return {
|
route,
|
goBack,
|
...toRefs(state)
|
};
|
}
|
});
|
</script>
|
|
<style scoped lang="scss">
|
.dark-page{
|
width: 100%;
|
height: 100%;
|
border:1px #5a5959 solid;
|
background: url('../../../../assets/warningScreen/body-bg.jpg');
|
padding: 1.25rem 4% 4%;
|
.btns{
|
position: fixed;
|
width: 8%;
|
height: 6%;
|
right: 5%;
|
top: 1.25rem;
|
display: flex;
|
align-items: center;
|
font-size: 1.125rem;
|
color: rgb(17, 254, 238);
|
cursor: pointer;
|
}
|
.msgTit{
|
font-size: 2rem;
|
color: rgb(17, 254, 238);
|
margin: 0 4rem;
|
}
|
}
|
.light-page{
|
width: 100%;
|
height: 100%;
|
border:1px #5a5959 solid;
|
background: #F0F0F0;
|
padding: 1.25rem 4% 4%;
|
.btns{
|
position: fixed;
|
width: 8%;
|
height: 6%;
|
right: 5%;
|
top: 1.25rem;
|
display: flex;
|
align-items: center;
|
font-size: 1.125rem;
|
color: #333;
|
cursor: pointer;
|
}
|
.msgTit{
|
font-size: 2rem;
|
color: #333;
|
margin: 0 4rem;
|
}
|
}
|
</style>
|
