refactor(ui): 优化用户界面和数据展示

- 修改记录时间筛选功能
- 调整异常类型默认值
-隐藏某些列的展示
- 更新触发规则相关逻辑
- 优化首页数据展示
- 更换登录背景图片
- 调整导航栏异常类型展示
boardTest
zch 3 months ago
parent 1cd2243184
commit 945385db93

@ -70,11 +70,12 @@
> >
<el-table-column type="selection" width="55" align="center"/> <el-table-column type="selection" width="55" align="center"/>
<el-table-column label="异常设备" align="center" prop="deviceName"/> <el-table-column label="异常设备" align="center" prop="deviceName"/>
<el-table-column label="异常类型" align="center" prop="alarmType"> <!-- <el-table-column label="异常类型" align="center" prop="alarmType">-->
<template slot-scope="scope"> <!-- <template slot-scope="scope">-->
<dict-tag :options="dict.type.alarm_type" :value="scope.row.alarmType"/> <!-- <dict-tag :options="dict.type.alarm_type" :value="scope.row.alarmType"/>-->
</template> <!-- </template>-->
</el-table-column> <!-- </el-table-column>-->
<el-table-column label="异常类型" align="center" prop="cause"/>
<el-table-column label="异常数据" align="center" prop="alarmData"/> <el-table-column label="异常数据" align="center" prop="alarmData"/>
<el-table-column label="异常状态" align="center" prop="alarmStatus"> <el-table-column label="异常状态" align="center" prop="alarmStatus">
<template slot-scope="scope"> <template slot-scope="scope">

@ -17,15 +17,15 @@
<!-- @keyup.enter.native="handleQuery"--> <!-- @keyup.enter.native="handleQuery"-->
<!-- />--> <!-- />-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- <el-form-item label="记录时间" prop="collectTime">--> <el-form-item label="记录时间" prop="collectTime">
<!-- <el-date-picker clearable--> <el-date-picker clearable
<!-- v-model="queryParams.collectTime"--> v-model="queryParams.collectTime"
<!-- type="date"--> type="date"
<!-- value-format="yyyy-MM-dd"--> value-format="yyyy-MM-dd"
<!-- placeholder="请选择记录时间"--> placeholder="请选择记录时间"
<!-- >--> >
<!-- </el-date-picker>--> </el-date-picker>
<!-- </el-form-item>--> </el-form-item>
<el-form-item label="异常类型" prop="alarmType"> <el-form-item label="异常类型" prop="alarmType">
<el-select v-model="queryParams.alarmType" placeholder="请选择异常类型" clearable> <el-select v-model="queryParams.alarmType" placeholder="请选择异常类型" clearable>
<el-option <el-option
@ -277,7 +277,7 @@ export default {
monitorId: null, monitorId: null,
collectDeviceId: null, collectDeviceId: null,
collectTime: null, collectTime: null,
alarmType: '1', alarmType: null,
alarmStatus: null, alarmStatus: null,
alarmData: null, alarmData: null,
operationName: null, operationName: null,
@ -296,7 +296,7 @@ export default {
columns: [ columns: [
{ key: 0, label: `自增标识`, visible: false }, { key: 0, label: `自增标识`, visible: false },
{ key: 1, label: `计量设备编号`, visible: true }, { key: 1, label: `计量设备编号`, visible: true },
{ key: 2, label: `采集设备编号`, visible: true }, { key: 2, label: `采集设备编号`, visible: false },
{ key: 3, label: `记录时间`, visible: true }, { key: 3, label: `记录时间`, visible: true },
{ key: 4, label: `异常类型`, visible: true }, { key: 4, label: `异常类型`, visible: true },
{ key: 5, label: `异常状态`, visible: true }, { key: 5, label: `异常状态`, visible: true },

@ -9,7 +9,7 @@
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<!-- <el-form-item label="触发规则" prop="triggerRule"> <el-form-item label="触发规则" prop="triggerRule">
<el-select v-model="queryParams.triggerRule" placeholder="请选择触发规则" clearable> <el-select v-model="queryParams.triggerRule" placeholder="请选择触发规则" clearable>
<el-option <el-option
v-for="dict in dict.type.trigger_rule" v-for="dict in dict.type.trigger_rule"
@ -18,7 +18,7 @@
:value="dict.value" :value="dict.value"
/> />
</el-select> </el-select>
</el-form-item> --> </el-form-item>
<!-- <el-form-item label="通知用户" prop="notifyUser">--> <!-- <el-form-item label="通知用户" prop="notifyUser">-->
<!-- <el-input--> <!-- <el-input-->
<!-- v-model="queryParams.notifyUser"--> <!-- v-model="queryParams.notifyUser"-->
@ -161,10 +161,10 @@
<!-- </el-date-picker>--> <!-- </el-date-picker>-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- <el-form-item label="能源类型" prop="energyType">--> <!-- <el-form-item label="能源类型" prop="energyType">-->
<!-- <el-input v-model="form.energyType" placeholder="请输入能源类型"/>--> <!-- <el-input v-model="form.energyType" placeholder="请输入能源类型" disabled/>-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- <el-form-item label="触发规则" prop="triggerRule"> <el-form-item label="触发规则" prop="triggerRule">
<el-radio-group v-model="form.triggerRule" disabled> <el-radio-group v-model="form.triggerRule" >
<el-radio <el-radio
v-for="dict in dict.type.trigger_rule" v-for="dict in dict.type.trigger_rule"
:key="dict.value" :key="dict.value"
@ -172,7 +172,7 @@
>{{ dict.label }} >{{ dict.label }}
</el-radio> </el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> --> </el-form-item>
<el-form-item label="监测字段" prop="monitorField" v-if="selectedMonitorType === 6 || selectedMonitorType === 10"> <el-form-item label="监测字段" prop="monitorField" v-if="selectedMonitorType === 6 || selectedMonitorType === 10">
<el-select v-model="form.monitorField" placeholder="请选择监测字段"> <el-select v-model="form.monitorField" placeholder="请选择监测字段">
<el-option v-for="dict in dict.type.monitor_field" :key="dict.value" :label="dict.label" :value="dict.value"/> <el-option v-for="dict in dict.type.monitor_field" :key="dict.value" :label="dict.label" :value="dict.value"/>
@ -244,7 +244,7 @@ export default {
monitorId: null, monitorId: null,
collectTime: null, collectTime: null,
energyType: null, energyType: null,
triggerRule: 0, triggerRule: null,
monitorField: null, monitorField: null,
timeRange: null, timeRange: null,
triggerValue: null, triggerValue: null,
@ -266,7 +266,7 @@ export default {
{ key: 3, label: `计量设备`, visible: true }, { key: 3, label: `计量设备`, visible: true },
{ key: 4, label: `记录时间`, visible: false }, { key: 4, label: `记录时间`, visible: false },
{ key: 5, label: `能源类型`, visible: false }, { key: 5, label: `能源类型`, visible: false },
{ key: 6, label: `触发规则`, visible: false }, { key: 6, label: `触发规则`, visible: true },
{ key: 7, label: `触发阈值次数`, visible: false }, { key: 7, label: `触发阈值次数`, visible: false },
{ key: 8, label: `时间范围(分)`, visible: false }, { key: 8, label: `时间范围(分)`, visible: false },
{ key: 9, label: `触发阈值量`, visible: true }, { key: 9, label: `触发阈值量`, visible: true },
@ -307,7 +307,7 @@ export default {
monitorId: null, monitorId: null,
collectTime: null, collectTime: null,
energyType: null, energyType: null,
triggerRule: 0, triggerRule: null,
monitorField: null, monitorField: null,
timeRange: null, timeRange: null,
triggerValue: null, triggerValue: null,

@ -1,10 +1,10 @@
<template> <template>
<div class="dashboard-container"> <div class="dashboard-container">
<!-- 页面标题 --> <!-- 页面标题 -->
<div class="page-header"> <!-- <div class="page-header">-->
<h1 class="page-title">机场行李系统设备健康监测系统</h1> <!-- <h1 class="page-title">机场行李系统设备健康监测系统</h1>-->
<div class="page-subtitle">首页</div> <!-- <div class="page-subtitle">首页</div>-->
</div> <!-- </div>-->
<!-- 统计卡片区域 --> <!-- 统计卡片区域 -->
<div class="stats-section"> <div class="stats-section">
@ -18,7 +18,7 @@
<div class="stat-label">设备总数</div> <div class="stat-label">设备总数</div>
</div> </div>
</div> </div>
<div class="stat-card alarm-rule"> <div class="stat-card alarm-rule">
<div class="stat-icon"> <div class="stat-icon">
<i class="el-icon-warning"></i> <i class="el-icon-warning"></i>
@ -28,7 +28,7 @@
<div class="stat-label">异常规则数量</div> <div class="stat-label">异常规则数量</div>
</div> </div>
</div> </div>
<div class="stat-card alarm-data"> <div class="stat-card alarm-data">
<div class="stat-icon"> <div class="stat-icon">
<i class="el-icon-bell"></i> <i class="el-icon-bell"></i>
@ -130,7 +130,7 @@
<!-- 无数据提示 --> <!-- 无数据提示 -->
<div v-if="!hasData(device)" class="no-data"> <div v-if="!hasData(device)" class="no-data">
<i class="el-icon-warning-outline"></i> <i class="el-icon-warning-outline"></i>
<span>无最新数据</span> <span>当天无最新数据</span>
</div> </div>
</div> </div>

@ -162,7 +162,7 @@ export default {
align-items: center; align-items: center;
height: 100%; height: 100%;
//background-image: url("../assets/images/login-background.jpg"); //background-image: url("../assets/images/login-background.jpg");
background-image: url("../assets/images/tao.png"); background-image: url("../assets/images/mesnac.jpg");
background-size: cover; background-size: cover;
} }
.title { .title {

Loading…
Cancel
Save