From 2ab19e1ce6119404dad466f387b0ad6c73d9c5b8 Mon Sep 17 00:00:00 2001 From: Admin <978517621@qq.com> Date: 星期四, 08 九月 2022 10:11:32 +0800 Subject: [PATCH] Default Changelist --- src/router/route.ts | 8 ++ src/views/riskWarningSys/warningBigScreen/components/message.vue | 12 ++ src/views/riskWarningSys/warningBigScreen/index.vue | 28 ++++--- src/views/riskWarningSys/warningBigScreen/indexs/msgDetail.vue | 135 +++++++++++++++++++++++++++++++++ 4 files changed, 169 insertions(+), 14 deletions(-) diff --git a/src/router/route.ts b/src/router/route.ts index 96ace6c..f88647d 100644 --- a/src/router/route.ts +++ b/src/router/route.ts @@ -119,5 +119,13 @@ meta: { title: '预警预报' } + }, + { + path: '/msgDetail', + name: 'msgDetail', + component: () => import('/@/views/riskWarningSys/warningBigScreen/indexs/msgDetail.vue'), + meta: { + title: 'spi报告详情' + } } ]; diff --git a/src/views/riskWarningSys/warningBigScreen/components/message.vue b/src/views/riskWarningSys/warningBigScreen/components/message.vue index 6f3b789..7a8327a 100644 --- a/src/views/riskWarningSys/warningBigScreen/components/message.vue +++ b/src/views/riskWarningSys/warningBigScreen/components/message.vue @@ -1,7 +1,7 @@ <template> <div class="charts-cont"> <div class="message"> - <dv-scroll-board ref="scrollBoard" :config="config" style="width:100%;height:100%" @mouseover="mouseoverHandler" @click="clickHandler" /> + <dv-scroll-board ref="scrollBoard" :config="config" style="width:100%;height:100%;cursor: pointer" @mouseover="mouseoverHandler" @click="clickHandler" /> </div> </div> </template> @@ -14,6 +14,7 @@ import { Session } from '/@/utils/storage'; import { Search } from '@element-plus/icons-vue' import { ElMessage } from 'element-plus' + import { useRouter } from 'vue-router' import type { FormInstance, FormRules } from 'element-plus' import { workApplyApi } from '/@/api/specialWorkSystem/workApply'; import * as echarts from 'echarts'; @@ -34,6 +35,7 @@ const { screenTheme } = storeToRefs(screenThemes); const userInfo = useUserInfo() const { userInfos } = storeToRefs(userInfo); + const router = useRouter(); const pro = ref("eChartPro" + Date.now() + Math.random()) const state = reactive<stateType>({ config:{ @@ -68,7 +70,13 @@ } const clickHandler = (e: any) => { - + console.log(e.row,'row') + router.push({ + path: 'msgDetail', + query: { + row: e.row + } + }) } function fontSize(val){ diff --git a/src/views/riskWarningSys/warningBigScreen/index.vue b/src/views/riskWarningSys/warningBigScreen/index.vue index b954ce2..b8cd4d4 100644 --- a/src/views/riskWarningSys/warningBigScreen/index.vue +++ b/src/views/riskWarningSys/warningBigScreen/index.vue @@ -430,7 +430,7 @@ .header-content { width: 100%; - height: 72px; + height: 7.8%; padding: 0 20px; font-size: 1.25rem; display: flex; @@ -444,15 +444,15 @@ align-items: center; justify-content: center; img { - height: 35px; - width: 128px; + width: 10rem; + height: auto; } } .title { width: 46%; font-size: 2rem; font-weight: bolder; - line-height: 72px; + line-height: 7.8%; text-align: center; letter-spacing: 2px; } @@ -468,6 +468,7 @@ .datetime { color: #11FEEE; + font-size: 0.9rem; } .btns{ display: flex; @@ -484,7 +485,8 @@ height: 1rem; } div{ - margin-left: 6px; + margin-left: 0.4rem; + font-size: 0.9rem; } } .themeBtn{ @@ -505,7 +507,7 @@ } .main-content{ width: 100%; - height: calc(100vh - 72px); + height: calc(100vh - 7.8%); padding: 0.4rem 1.5rem 2rem; display: flex; align-items: center; @@ -728,7 +730,7 @@ .header-content { width: 100%; - height: 72px; + height: 7.8%; padding: 0 20px; font-size: 1.25rem; display: flex; @@ -742,15 +744,15 @@ align-items: center; justify-content: center; img { - height: 35px; - width: 128px; + width: 10rem; + height: auto; } } .title { width: 46%; font-size: 2rem; font-weight: bolder; - line-height: 72px; + line-height: 7.8%; text-align: center; letter-spacing: 2px; } @@ -766,6 +768,7 @@ .datetime { color: #000; + font-size: 0.9rem; } .btns{ display: flex; @@ -782,7 +785,8 @@ height: 1rem; } div{ - margin-left: 6px; + margin-left: 0.4rem; + font-size: 0.9rem; } } .themeBtn{ @@ -803,7 +807,7 @@ } .main-content{ width: 100%; - height: calc(100vh - 72px); + height: calc(100vh - 7.8%); padding: 0.4rem 1.5rem 2rem; display: flex; align-items: center; diff --git a/src/views/riskWarningSys/warningBigScreen/indexs/msgDetail.vue b/src/views/riskWarningSys/warningBigScreen/indexs/msgDetail.vue new file mode 100644 index 0000000..96018d9 --- /dev/null +++ b/src/views/riskWarningSys/warningBigScreen/indexs/msgDetail.vue @@ -0,0 +1,135 @@ +<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"> + Decoration + </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 { + + } + export default defineComponent({ + name: 'msgDetail', + components: { + + }, + setup() { + const screenThemes = useScreenTheme() + const { screenTheme } = storeToRefs(screenThemes); + const route = useRoute(); + const state = reactive<stateType>({ + lineColor: ['#11FEEE'], + }); + + // 页面载入时执行方法 + onMounted(() => { + // if (route.query.row) { + // state.row = route.query.num + // } + 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> \ No newline at end of file -- Gitblit v1.9.2