实时数据页面样式修改

This commit is contained in:
stt
2025-12-10 10:30:32 +08:00
parent 0419af8e50
commit 37ed693cea
2 changed files with 24 additions and 87 deletions

View File

@@ -372,7 +372,7 @@ export function getTimeOfTheMonth(key: any): [string, string] {
* @param fullscreen // 全屏是否全屏 * @param fullscreen // 全屏是否全屏
*/ */
export function getTime(interval: number | 3, timeList: any, externalTime: any) { export function getTime(interval: number | 3, timeList: any, externalTime: any) {
console.log('🚀 ~ getTime ~ timeList:', timeList) // console.log('🚀 ~ getTime ~ timeList:', timeList)
// 1、先匹配时间 // 1、先匹配时间
// 检查 interval 是否在 timeList 中 // 检查 interval 是否在 timeList 中
if (timeList && timeList.includes(interval.toString())) { if (timeList && timeList.includes(interval.toString())) {

View File

@@ -1,8 +1,9 @@
<template> <template>
<div class="default-main" :style="{ padding: prop.height ? '0px !important' : '10px' }"> <div class="default-main" :style="{ padding: prop.height ? '0px !important' : '10px' }">
<!-- 实时数据 --> <!-- 实时数据 -->
<!-- 实时数据 走驾驶舱-->
<!-- 添加加载事件监听 --> <!-- 添加加载事件监听 -->
<div class="dataBox" :style="{ height: prop.height || pageHeight.height }"> <div class="dataBox" :style="{ height: prop.height ? prop.height : pageHeight.height }">
<div <div
class="iframe-container" class="iframe-container"
:style="{ :style="{
@@ -52,7 +53,7 @@ import { mainHeight } from '@/utils/layout'
const prop = defineProps({ const prop = defineProps({
width: { type: [String, Number] }, width: { type: [String, Number] },
height: { type: [String, Number] }, height: { type: [String, Number] },
timeKey: { type: Array as () => string[] }, timeKey: { type: Array as () => string[] },
timeValue: { type: Object } timeValue: { type: Object }
}) })
@@ -69,96 +70,29 @@ window.addEventListener('message', function (event) {
} }
}) })
// const tableStore: any = new TableStore({
// url: '/user-boot/role/selectRoleDetail?id=0',
// method: 'POST',
// showPage: false,
// column: [
// {
// field: 'index',
// title: '序号',
// width: '80',
// formatter: (row: any) => {
// return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
// }
// },
// {
// title: '时间',
// field: 'whetherToGovern',
// minWidth: '70'
// },
// {
// title: '监测点名',
// field: 'name',
// minWidth: '90'
// // render: 'customTemplate',
// // customTemplate: (row: any) => {
// // return `<span style='cursor: pointer;text-decoration: underline;'>${row.name}</span>`
// // }
// },
// { title: '事件描述', field: 'question', minWidth: '200' }
// ],
// beforeSearchFun: () => {
// // tableStore.table.params.searchBeginTime = prop.timeValue?.[0] || getTimeOfTheMonth(prop.timeKey)[0]
// // tableStore.table.params.searchEndTime = prop.timeValue?.[1] || getTimeOfTheMonth(prop.timeKey)[1]
// },
// loadCallback: () => {
// tableStore.table.data = [
// {
// name: '10kV1#电动机',
// type: '电动机',
// whetherToGovern: '2025-01-01 15:00:00',
// question: '3次谐波电压、5次谐波电流、电压不平衡度超标'
// },
// {
// name: '10kV2#(治理后)',
// type: '电焊机',
// whetherToGovern: '2025-05-01 16:00:00',
// question: '所有指标均合格'
// },
// {
// name: '380V电焊机(治理前)',
// type: '电焊机',
// whetherToGovern: '2025-06-01 15:00:00',
// question: '5次谐波电流、电压不平衡度超标'
// },
// {
// name: '380V水泵机',
// type: '电动机',
// whetherToGovern: '2025-08-01 15:00:00',
// question: '所有指标均合格'
// }
// ]
// }
// })
const tableRef = ref() const tableRef = ref()
// provide('tableRef', tableRef)
// const pageHeight = mainHeight(40) const pageHeight = mainHeight(40)
// provide('tableStore', tableStore)
const reset = () => { const reset = () => {
// 向 iframe 发送复位事件 // 向 iframe 发送复位事件
sendResetToIframe(); sendResetToIframe()
// 清空表格数据 // 清空表格数据
// tableData.value = []; // tableData.value = [];
} }
// 向 iframe 发送复位消息的函数 // 向 iframe 发送复位消息的函数
const sendResetToIframe = () => { const sendResetToIframe = () => {
const iframe = document.getElementById('iframeLeft') as HTMLIFrameElement; const iframe = document.getElementById('iframeLeft') as HTMLIFrameElement
if (iframe && iframe.contentWindow) { if (iframe && iframe.contentWindow) {
iframe.contentWindow.postMessage( iframe.contentWindow.postMessage(
{ {
type: 'RESET_EVENT', type: 'RESET_EVENT',
payload: true payload: true
}, },
'*' // 生产环境中应替换为具体的域名 '*' // 生产环境中应替换为具体的域名
); )
} }
} }
const iframeSrc = ref('') const iframeSrc = ref('')
@@ -186,7 +120,7 @@ const iframeSrc = ref('')
onMounted(() => { onMounted(() => {
iframeSrc.value = iframeSrc.value =
window.location.origin + `/zutai/?id=4b4f7f4260198776594f5f9d93a532e8&&name=stt&&preview=true#/preview_YPT` window.location.origin + `/zutai/?id=4b4f7f4260198776594f5f9d93a532e8&&name=stt&&preview=true#/preview_YPT`
// tableStore.index() // tableStore.index()
@@ -261,16 +195,19 @@ const sendKeysToIframe = (keyList: string[]) => {
.iframe-container { .iframe-container {
flex: 3.5; flex: 3.5;
} }
:deep(.el-card__body) { :deep(.el-card__body) {
display: flex; display: flex;
padding: 10px; padding: 10px;
height: 100%; height: 100%;
.buttonBox { .buttonBox {
display: flex; display: flex;
width: 150px; width: 150px;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.tableBox { .tableBox {
flex: 1; flex: 1;
width: 100%; width: 100%;