Web/admin-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

设备监控-实时数据顶部按钮组改为便携式设备所有tab显示

Browse Source
This commit is contained in:
zhujiyan
2024-08-23 08:51:36 +08:00
parent 0a590c2862
commit f879cdaf09
5 changed files with 85 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/views/govern/device/control/analysisList/index.vue
View File

@@ -1,9 +1,6 @@
<!-- 解析列表 -->
<template>
<el-dialog v-model="dialogVisible" title="解析列表" width="70%" draggable @closed="close">
<!-- <div class="header_btn">
<el-button type="primary" size="small" @click="handleBack" :icon="ArrowLeft">返回</el-button>
</div> -->
<TableHeader date-picker></TableHeader>
<Table ref="tableRef" />
<template #footer>
@@ -15,16 +12,19 @@
</el-dialog>
</template>
<script lang="ts" setup>
import { ref, onMounted, provide } from 'vue'
import { ref, onMounted, provide, watch, onBeforeUnmount } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { ArrowLeft } from '@element-plus/icons-vue'
const emit = defineEmits(['back'])
const dialogVisible = ref(false)
const height = ref(0)
height.value = window.innerHeight < 1080 ? 180 : 400
const tableStore: any = new TableStore({
url: '/cs-device-boot/portableOfflLog/queryPage',
publicHeight: 210,
publicHeight: height.value,
method: 'POST',
column: [
// { width: '60', type: 'checkbox', fixed: 'left' },
@@ -76,8 +76,28 @@ const open = () => {
const close = () => {
dialogVisible.value = false
}
const initTable = () => {}
onMounted(() => {})
const updateViewportHeight = async () => {
// height.value = window.innerHeight;
height.value = window.innerHeight < 1080 ? 180 : 400
tableStore.table.publicHeight = height.value
await tableStore.index()
}
onMounted(() => {
updateViewportHeight() // 初始化视口高度
window.addEventListener('resize', updateViewportHeight) // 监听窗口大小变化
})
onBeforeUnmount(() => {
window.removeEventListener('resize', updateViewportHeight) // 移除监听
})
defineExpose({ open })
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
::v-deep .el-dialog_body {
overflow-y: hidden !important;
.analysisTable {
height: 400px !important;
}
}
</style>

47
src/views/govern/device/control/index.vue
View File

@@ -5,40 +5,20 @@
v-loading="loading"
style="position: relative"
>
<PointTree @node-click="nodeClick" @init="nodeClick"></PointTree>
<PointTree @node-click="nodeClick" @init="nodeClick" @pointTypeChange="pointTypeChange"></PointTree>
<div class="device-control-right" v-if="deviceData">
<el-descriptions title="设备基本信息" class="mb10" :column="3" border>
<template #extra>
<el-button
v-if="dataSet.indexOf('_realtimedata') != -1"
size="small"
type="primary"
@click="handleDownLoadTemplate"
>
<el-button v-if="deviceType == '1'" size="small" type="primary" @click="handleDownLoadTemplate">
模版下载
</el-button>
<el-button
v-if="dataSet.indexOf('_realtimedata') != -1"
size="small"
type="primary"
@click="handleImport"
>
<el-button v-if="deviceType == '1'" size="small" type="primary" @click="handleImport">
离线数据导入
</el-button>
<el-button
v-if="dataSet.indexOf('_realtimedata') != -1"
size="small"
type="primary"
@click="handleaddDevice"
>
<el-button v-if="deviceType == '1'" size="small" type="primary" @click="handleaddDevice">
设备补招
</el-button>
<el-button
v-if="dataSet.indexOf('_realtimedata') != -1"
size="small"
type="primary"
@click="handleAnalysisList"
>
<el-button v-if="deviceType == '1'" size="small" type="primary" @click="handleAnalysisList">
解析列表
</el-button>
</template>
@@ -100,7 +80,16 @@
<el-button type="primary" icon="el-icon-Search" @click="handleClick">查询</el-button>
</el-form-item>
</el-form>
<div style="height: calc(100vh - 300px)" v-if="tableData.length == 0" v-loading="tableLoading"></div>
<div
style="height: calc(100vh - 300px)"
v-if="
dataSet.indexOf('_trenddata') == -1 &&
dataSet.indexOf('_realtimedata') == -1 &&
dataSet.indexOf('_event') == -1 &&
tableData.length == 0
"
v-loading="tableLoading"
></div>
<div
style="overflow: auto"
:style="{ height: tableHeight }"
@@ -416,6 +405,12 @@ const nodeClick = async (e: anyObj) => {
loading.value = false
}
}
//治理设备和便携式设备切换判断
const deviceType = ref('0')
const pointTypeChange = (val: any, obj: any) => {
deviceType.value = val
nodeClick(obj)
}
const realTimeRef: any = ref()
const intRealTime = async (val: any) => {
await getTabsDataByType(val).then(res => {

16
src/views/govern/device/control/tabs/realtime.vue
View File

@@ -20,7 +20,7 @@
<div class="right_charts"><MyEchart ref="pieChart6" :options="echartsDataA3"></MyEchart></div>
</div>
</div>
<div class="view_bot" v-loading="loading">
<div class="view_bot" v-loading="loading">
<div class="view_bot_tables">
<!-- 表格数据 -->
<div v-if="tableData.length != 0">
@@ -75,10 +75,10 @@
<div class="tbody">
<div class="tbody_cell" v-for="(vv, key) in item" :key="key">
{{
tableData.find(item => {
tableData.find((item: any) => {
return item.anotherName == vv.showName && item.phase == vv.phase
})?.statisticalData
? tableData.find(item => {
? tableData.find((item: any) => {
return item.anotherName == vv.showName && item.phase == vv.phase
})?.statisticalData
: '/'
@@ -317,7 +317,7 @@ const initRadioCharts = () => {
}
},
{
value:70,
value: 70,
name: 'B相',
itemStyle: {
color: '#DAA521'
@@ -448,7 +448,7 @@ const getTableData = (list: any) => {
})?.statisticalData
})
if (index < 4) {
columnsDataTop.value.push(item)
columnsDataTop.value.push(item)
}
if (index >= 4) {
columnsDataBot.value.push(item)
@@ -582,8 +582,8 @@ onMounted(() => {
height: auto;
display: flex;
justify-content: space-between;
border: 1px solid #eee;
padding: 10px;
//border: 1px solid #eee;
// padding: 10px;
.view_top_left,
.view_top_right {
width: 30%;
@@ -650,7 +650,7 @@ onMounted(() => {
.table_info {
width: 100%;
height: 120px;
border: 1px solid #eee;
// border: 1px solid #eee;
border-bottom: 2px solid #eee;
margin-bottom: 20px;
display: flex;