From 0ae83a895e80a4b9777a27f613d721a7e5e2ac18 Mon Sep 17 00:00:00 2001
From: ali <ali9696@163.com>
Date: 星期二, 03 九月 2024 10:18:27 +0800
Subject: [PATCH] 整体样式修改
---
energy_management_ui/src/views/energyAlarm/historicalAlarm/historyAlarmNote.vue | 563 +++++++++++++++++++++++++++++++-------------------------
1 files changed, 313 insertions(+), 250 deletions(-)
diff --git a/energy_management_ui/src/views/energyAlarm/historicalAlarm/historyAlarmNote.vue b/energy_management_ui/src/views/energyAlarm/historicalAlarm/historyAlarmNote.vue
index 9e28403..7eac573 100644
--- a/energy_management_ui/src/views/energyAlarm/historicalAlarm/historyAlarmNote.vue
+++ b/energy_management_ui/src/views/energyAlarm/historicalAlarm/historyAlarmNote.vue
@@ -2,24 +2,40 @@
<template>
<div class="app-container" style="padding:0">
<el-card class="box-card">
- <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" class="query-form">
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ label-width="68px"
+ class="query-form"
+ >
<el-form-item label="闄愬�肩被鍨�" prop="limitType">
- <el-select v-model="queryParams.limitType" placeholder="闄愬�肩被鍨�" clearable>
+ <el-select
+ v-model="queryParams.limitType"
+ placeholder="闄愬�肩被鍨�"
+ clearable
+ >
<el-option
v-for="dict in limitTypeOptions"
:key="dict.limitCode"
:label="dict.limitName"
- :value="dict.limitCode">
+ :value="dict.limitCode"
+ >
</el-option>
</el-select>
</el-form-item>
<el-form-item label="鎶ヨ绾у埆" prop="alarmLevel">
- <el-select v-model="queryParams.alarmLevel" placeholder="鎶ヨ绾у埆" clearable>
+ <el-select
+ v-model="queryParams.alarmLevel"
+ placeholder="鎶ヨ绾у埆"
+ clearable
+ >
<el-option
v-for="dict in alarmLevelOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
- :value="dict.dictValue">
+ :value="dict.dictValue"
+ >
</el-option>
</el-select>
</el-form-item>
@@ -40,61 +56,105 @@
value-format="yyyy-MM-dd HH:mm:ss"
range-separator="鑷�"
start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡">
+ end-placeholder="缁撴潫鏃ユ湡"
+ >
</el-date-picker>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">鏌ヨ</el-button>
+ <el-button
+ type="primary"
+ icon="el-icon-search"
+ size="mini"
+ @click="handleQuery"
+ >鏌ヨ</el-button
+ >
</el-form-item>
-
</el-form>
<el-row :gutter="10" class="mb8">
-<!-- <el-col :span="1.5">-->
-<!-- <el-button-->
-<!-- type="warning"-->
-<!-- icon="el-icon-download"-->
-<!-- size="mini"-->
-<!-- @click="handleExport"-->
-<!-- v-hasPermi="['energyAlarm:historicalAlarm:export']"-->
-<!-- >瀵煎嚭-->
-<!-- </el-button>-->
-<!-- </el-col>-->
+ <!-- <el-col :span="1.5">-->
+ <!-- <el-button-->
+ <!-- type="warning"-->
+ <!-- icon="el-icon-download"-->
+ <!-- size="mini"-->
+ <!-- @click="handleExport"-->
+ <!-- v-hasPermi="['energyAlarm:historicalAlarm:export']"-->
+ <!-- >瀵煎嚭-->
+ <!-- </el-button>-->
+ <!-- </el-col>-->
</el-row>
<el-form>
- <el-table :data="JkHistoryAlarmList" v-loading="loading" border @selection-change="" @cell-click="openDialog" >
- <el-table-column label="搴忓彿" type="index" align="center"/>
- <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code"/>
- <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="indexName">
- <template slot-scope="scope">
- <div style="color:blue;text-decoration:underline ;cursor:pointer">{{scope.row.indexName}}</div>
- </template>
- </el-table-column>
- <el-table-column label="鎸囨爣鍗曚綅" align="center" prop="unitId" />
- <el-table-column label="鎶ヨ绾у埆" align="center" prop="alarmLevel" />
- <el-table-column label="闄愬�肩被鍨�" align="center" prop="limitType" />
- <el-table-column label="闄愬��" align="center" prop="limitingValue"/>
- <el-table-column label="鎶ヨ鏃堕棿璧�" align="center" prop="alarmBeginTime"/>
- <el-table-column label="鎶ヨ鏃堕棿姝�" align="center" prop="alarmEndTime"/>
- <el-table-column label="鎶ヨ鍊�" align="center" prop="alarmValue" />
- <el-table-column label="鎸佺画鏃堕暱(鍒嗛挓)" align="center" prop="duration" width="96px" />
- </el-table>
+ <el-table
+ :data="JkHistoryAlarmList"
+ v-loading="loading"
+ border
+ @selection-change=""
+ @cell-click="openDialog"
+ >
+ <el-table-column label="搴忓彿" type="index" align="center" />
+ <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code" />
+ <el-table-column label="鎸囨爣鍚嶇О" align="center" prop="indexName">
+ <template slot-scope="scope">
+ <div style="color:blue;text-decoration:underline ;cursor:pointer">
+ {{ scope.row.indexName }}
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎸囨爣鍗曚綅" align="center" prop="unitId" />
+ <el-table-column label="鎶ヨ绾у埆" align="center" prop="alarmLevel" />
+ <el-table-column label="闄愬�肩被鍨�" align="center" prop="limitType" />
+ <el-table-column label="闄愬��" align="center" prop="limitingValue" />
+ <el-table-column
+ label="鎶ヨ鏃堕棿璧�"
+ align="center"
+ prop="alarmBeginTime"
+ />
+ <el-table-column
+ label="鎶ヨ鏃堕棿姝�"
+ align="center"
+ prop="alarmEndTime"
+ />
+ <el-table-column label="鎶ヨ鍊�" align="center" prop="alarmValue" />
+ <el-table-column
+ label="鎸佺画鏃堕暱(鍒嗛挓)"
+ align="center"
+ prop="duration"
+ width="96px"
+ />
+ </el-table>
</el-form>
<pagination
- v-show="total>0"
+ v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!--寮规-->
- <el-dialog :title="title" :visible.sync="open" width="1000px" :close-on-click-modal="false">
- <el-row style="background:#fff;margin-bottom:32px;">
- <el-tabs v-model="activeName" @tab-click="handleClick" >
+ <el-dialog
+ :title="title"
+ :visible.sync="open"
+ width="1000px"
+ :close-on-click-modal="false"
+ >
+ <el-row style="margin-bottom:32px;">
+ <el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="鍘嗗彶鏁版嵁鏇茬嚎鍥�" name="second">
- <history-alarm-view ref="historyAlarmView" :code="code" :activeName="activeName" :limitVal="limitVal"></history-alarm-view>
+ <history-alarm-view
+ ref="historyAlarmView"
+ :code="code"
+ :activeName="activeName"
+ :limitVal="limitVal"
+ ></history-alarm-view>
</el-tab-pane>
<el-tab-pane label="鍘嗗彶鏁版嵁鏌ヨ" name="third">
- <history-alarm-table ref="historyAlarmTable" :code="code" :indexName="indexName" :activeName="activeName" :indexUnit="indexUnit" :limitVal="limitVal"></history-alarm-table>
+ <history-alarm-table
+ ref="historyAlarmTable"
+ :code="code"
+ :indexName="indexName"
+ :activeName="activeName"
+ :indexUnit="indexUnit"
+ :limitVal="limitVal"
+ ></history-alarm-table>
</el-tab-pane>
</el-tabs>
</el-row>
@@ -107,217 +167,220 @@
</template>
<script>
+import {
+ listHistoryAlarmNote,
+ exportHistoricalAlarm
+} from "@/api/basicsetting/historyAlarm";
+import { listLimitType } from "@/api/basicsetting/limitType";
+import historyAlarmView from "../realTimeAlarm/historyAlarmView";
+import historyAlarmTable from "../realTimeAlarm/historyAlarmTable";
- import {listHistoryAlarmNote,exportHistoricalAlarm } from "@/api/basicsetting/historyAlarm";
- import {listLimitType} from "@/api/basicsetting/limitType"
- import historyAlarmView from "../realTimeAlarm/historyAlarmView"
- import historyAlarmTable from "../realTimeAlarm/historyAlarmTable"
-
- export default {
- components: {historyAlarmView,historyAlarmTable},
- name: 'historyAlarmNote',
- props:['svgId','tagId'],
- data() {
- return {
- num: 20,
- num1:5,
- code:undefined,
- value:'',
- options:undefined,
- radio: 'B',
- activeName: 'second',
- indexId:undefined,
- indexName:undefined,
- indexUnit:undefined,
- limitVal:undefined,
- hiddenTableHeader:false,
- limitTypeOptions:[],
- alarmLevelOptions:[],
- resposeList:[],
- // 閬僵灞�
- loading: false,
- // 閫変腑鏁扮粍
- ids: [],
- dateRange: [],
- names: [],
- // 闈炲崟涓鐢�
- single: true,
- // 闈炲涓鐢�
- multiple: true,
- // 鎬绘潯鏁�
- total: 10,
- // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
- List: [],
- energyindexList: [],
- // 寮瑰嚭灞傛爣棰�
- JkHistoryAlarmList:[],
- title: "鍘嗗彶鏁版嵁鏌ヨ",
- // 鏄惁鏄剧ず寮瑰嚭灞�
- open: false,
- // 涓婚敭瀛楀吀
- indexIdOptions: [],
- // 鎸囨爣鍚嶇О瀛楀吀
- nameOptions: [],
- // 鎸囨爣缂栫爜瀛楀吀
- codeOptions: [],
- // 鍗曚綅瀛楀吀
- unitIdOptions: [],
- // 鏌ヨ鍙傛暟
- lineChartData:{
- newVisitis:null,
- },
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- indexType:'COLLECT',
- code: undefined,
- indexName:undefined,
- limitType: undefined,
- alarmLevel: undefined,
- nodeId:undefined,
- beginTime: undefined,
- endTime:undefined,
- svgId:undefined,
- nodeId:undefined,
- },
- // 琛ㄥ崟鍙傛暟
- form: {},
- // 琛ㄥ崟鏍￠獙
- indexCategoryDefaultVal: undefined,
- unitDefaultVal: undefined
- };
- },
- created() {
- if (this.$props.tagId) {
- this.queryParams.nodeId = this.$props.tagId;
- }
- //this.queryParams.svgId=this.svgId;
- this.getDicts("alarm_level").then(response => {
- this.alarmLevelOptions = response.data;
- });
- this.getDicts("sys_unit").then(response => {
- this.unitIdOptions = response.data;
- });
- listLimitType(this.queryParams).then(response => {
- this.limitTypeOptions = response.rows;
- });
- },
- methods: {
- show(nodeId)
- {
- this.queryParams.nodeId = nodeId;
- this.getList();
+export default {
+ components: { historyAlarmView, historyAlarmTable },
+ name: "historyAlarmNote",
+ props: ["svgId", "tagId"],
+ data() {
+ return {
+ num: 20,
+ num1: 5,
+ code: undefined,
+ value: "",
+ options: undefined,
+ radio: "B",
+ activeName: "second",
+ indexId: undefined,
+ indexName: undefined,
+ indexUnit: undefined,
+ limitVal: undefined,
+ hiddenTableHeader: false,
+ limitTypeOptions: [],
+ alarmLevelOptions: [],
+ resposeList: [],
+ // 閬僵灞�
+ loading: false,
+ // 閫変腑鏁扮粍
+ ids: [],
+ dateRange: [],
+ names: [],
+ // 闈炲崟涓鐢�
+ single: true,
+ // 闈炲涓鐢�
+ multiple: true,
+ // 鎬绘潯鏁�
+ total: 10,
+ // 鎸囨爣淇℃伅琛ㄦ牸鏁版嵁
+ List: [],
+ energyindexList: [],
+ // 寮瑰嚭灞傛爣棰�
+ JkHistoryAlarmList: [],
+ title: "鍘嗗彶鏁版嵁鏌ヨ",
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ // 涓婚敭瀛楀吀
+ indexIdOptions: [],
+ // 鎸囨爣鍚嶇О瀛楀吀
+ nameOptions: [],
+ // 鎸囨爣缂栫爜瀛楀吀
+ codeOptions: [],
+ // 鍗曚綅瀛楀吀
+ unitIdOptions: [],
+ // 鏌ヨ鍙傛暟
+ lineChartData: {
+ newVisitis: null
},
- getList() {
- this.loading = true;
- listHistoryAlarmNote(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
- this.JkHistoryAlarmList = response.rows;
- this.total = response.total;
- this.loading = false;
- });
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ indexType: "COLLECT",
+ code: undefined,
+ indexName: undefined,
+ limitType: undefined,
+ alarmLevel: undefined,
+ nodeId: undefined,
+ beginTime: undefined,
+ endTime: undefined,
+ svgId: undefined,
+ nodeId: undefined
},
- /** 鏌ョ湅鎸夐挳鎿嶄綔 */
- handleUpdate(row) {
- this.reset();
- const indexId = row.indexId || this.ids;
- this.open = true;
- },
- // 鍗曚綅瀛楀吀缈昏瘧
- unitIdFormat(row, column) {
- return this.selectDictLabel(this.unitIdOptions, row.unitId);
- },
- // 鎶ヨ绾у埆瀛楀吀缈昏瘧
- alarmLevelFormat(row, column) {
- return this.selectDictLabel(this.alarmLevelOptions, row.alarmLevel);
- },
- // 鍙栨秷鎸夐挳
- cancel() {
- this.open = false;
- this.reset();
- },
- // 琛ㄥ崟閲嶇疆
- reset() {
- this.form = {
- indexId: undefined,
- name: undefined,
- code: undefined,
- indexCategory: undefined,
- remark: undefined,
- unitId: undefined
- };
- this.resetForm("form");
- },
- // modelNodeChange(modelNode) {
- // this.queryParams.nodeId = modelNode.id;
- // this.getList();
- // },
- formatDate: function (value) {
- let date = new Date(value);
- let y = date.getFullYear();
- let MM = date.getMonth() + 1;
- MM = MM < 10 ? ('0' + MM) : MM;
- let d = date.getDate();
- d = d < 10 ? ('0' + d) : d;
- let h = date.getHours();
- h = h < 10 ? ('0' + h) : h;
- let m = date.getMinutes();
- m = m < 10 ? ('0' + m) : m;
- let s = date.getSeconds();
- s = s < 10 ? ('0' + s) : s;
- return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
- },
-
-
- /** 鎼滅储鎸夐挳鎿嶄綔 */
- handleQuery() {
- this.getList();
- },
- /** 閲嶇疆鎸夐挳鎿嶄綔 */
- resetQuery() {
- this.dateRange = [];
- this.resetForm("queryForm");
- },
-
- handleSelectionChange() {
- },
- openDialog(row,column,event,cell){
- if("indexName"==column.property){
- this.open = true;
- }
- this.code = row.code;
- this.indexName = row.indexName;
- this.indexId = row.indexId;
- this.activeName = "second";
- this.indexUnit = row.unitId;
- this.limitVal = row.limitingValue;
- },
- /** 瀵煎嚭鎸夐挳鎿嶄綔 */
- handleExport() {
- const queryParams = this.queryParams;
- this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夋姤璀︽暟鎹」?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(function() {
- return exportHistoricalAlarm(queryParams);
- }).then(response => {
- this.download(response.msg);
- }).catch(function() {});
-
- },
- //闄愬埗绫诲瀷缈昏瘧
- limitTypeFormat(row,column){
- var actions = [];
- Object.keys(this.limitTypeOptions).map((key) => {
- if (this.limitTypeOptions[key].limitCode == ('' + row.limitType)) {
- actions.push(this.limitTypeOptions[key].limitName);
- }
- });
- return actions.join('');
- },
- handleClick(tab, event){
- this.activeName = tab.name;
- },
+ // 琛ㄥ崟鍙傛暟
+ form: {},
+ // 琛ㄥ崟鏍￠獙
+ indexCategoryDefaultVal: undefined,
+ unitDefaultVal: undefined
+ };
+ },
+ created() {
+ if (this.$props.tagId) {
+ this.queryParams.nodeId = this.$props.tagId;
}
- };
+ //this.queryParams.svgId=this.svgId;
+ this.getDicts("alarm_level").then(response => {
+ this.alarmLevelOptions = response.data;
+ });
+ this.getDicts("sys_unit").then(response => {
+ this.unitIdOptions = response.data;
+ });
+ listLimitType(this.queryParams).then(response => {
+ this.limitTypeOptions = response.rows;
+ });
+ },
+ methods: {
+ show(nodeId) {
+ this.queryParams.nodeId = nodeId;
+ this.getList();
+ },
+ getList() {
+ this.loading = true;
+ listHistoryAlarmNote(
+ this.addDateRange(this.queryParams, this.dateRange)
+ ).then(response => {
+ this.JkHistoryAlarmList = response.rows;
+ this.total = response.total;
+ this.loading = false;
+ });
+ },
+ /** 鏌ョ湅鎸夐挳鎿嶄綔 */
+ handleUpdate(row) {
+ this.reset();
+ const indexId = row.indexId || this.ids;
+ this.open = true;
+ },
+ // 鍗曚綅瀛楀吀缈昏瘧
+ unitIdFormat(row, column) {
+ return this.selectDictLabel(this.unitIdOptions, row.unitId);
+ },
+ // 鎶ヨ绾у埆瀛楀吀缈昏瘧
+ alarmLevelFormat(row, column) {
+ return this.selectDictLabel(this.alarmLevelOptions, row.alarmLevel);
+ },
+ // 鍙栨秷鎸夐挳
+ cancel() {
+ this.open = false;
+ this.reset();
+ },
+ // 琛ㄥ崟閲嶇疆
+ reset() {
+ this.form = {
+ indexId: undefined,
+ name: undefined,
+ code: undefined,
+ indexCategory: undefined,
+ remark: undefined,
+ unitId: undefined
+ };
+ this.resetForm("form");
+ },
+ // modelNodeChange(modelNode) {
+ // this.queryParams.nodeId = modelNode.id;
+ // this.getList();
+ // },
+ formatDate: function(value) {
+ let date = new Date(value);
+ let y = date.getFullYear();
+ let MM = date.getMonth() + 1;
+ MM = MM < 10 ? "0" + MM : MM;
+ let d = date.getDate();
+ d = d < 10 ? "0" + d : d;
+ let h = date.getHours();
+ h = h < 10 ? "0" + h : h;
+ let m = date.getMinutes();
+ m = m < 10 ? "0" + m : m;
+ let s = date.getSeconds();
+ s = s < 10 ? "0" + s : s;
+ return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
+ },
+
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.getList();
+ },
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.dateRange = [];
+ this.resetForm("queryForm");
+ },
+
+ handleSelectionChange() {},
+ openDialog(row, column, event, cell) {
+ if ("indexName" == column.property) {
+ this.open = true;
+ }
+ this.code = row.code;
+ this.indexName = row.indexName;
+ this.indexId = row.indexId;
+ this.activeName = "second";
+ this.indexUnit = row.unitId;
+ this.limitVal = row.limitingValue;
+ },
+ /** 瀵煎嚭鎸夐挳鎿嶄綔 */
+ handleExport() {
+ const queryParams = this.queryParams;
+ this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夋姤璀︽暟鎹」?", "璀﹀憡", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ })
+ .then(function() {
+ return exportHistoricalAlarm(queryParams);
+ })
+ .then(response => {
+ this.download(response.msg);
+ })
+ .catch(function() {});
+ },
+ //闄愬埗绫诲瀷缈昏瘧
+ limitTypeFormat(row, column) {
+ var actions = [];
+ Object.keys(this.limitTypeOptions).map(key => {
+ if (this.limitTypeOptions[key].limitCode == "" + row.limitType) {
+ actions.push(this.limitTypeOptions[key].limitName);
+ }
+ });
+ return actions.join("");
+ },
+ handleClick(tab, event) {
+ this.activeName = tab.name;
+ }
+ }
+};
</script>
--
Gitblit v1.9.3