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/history/query/historyIndex.vue | 524 +++++++++++++++++++++++++++++++-------------------------- 1 files changed, 284 insertions(+), 240 deletions(-) diff --git a/energy_management_ui/src/views/history/query/historyIndex.vue b/energy_management_ui/src/views/history/query/historyIndex.vue index e734aa3..e0226ee 100644 --- a/energy_management_ui/src/views/history/query/historyIndex.vue +++ b/energy_management_ui/src/views/history/query/historyIndex.vue @@ -1,11 +1,16 @@ - <template> <div class="app-container" style="padding:0"> <el-card class="box-card"> <div slot="header" class="clearfix"> - <span>{{currentNode?currentNode.label:''}}--鑺傜偣璁剧疆</span> + <span>{{ currentNode ? currentNode.label : "" }}--鑺傜偣璁剧疆</span> </div> - <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="璧锋鏃堕棿"> <el-date-picker v-model="dateRange" @@ -13,14 +18,20 @@ 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-button icon="el-icon-refresh" size="mini" @click="resetQuery">閲嶇疆</el-button>--> </el-form-item> - </el-form> <el-row :gutter="10" class="mb8"> <el-col :span="1.5"> @@ -30,22 +41,35 @@ 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="modelName"/> - <el-table-column label="鎸囨爣缂栫爜" align="center" prop="code"/> + <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="modelName" /> + <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> + <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" :formatter="unitIdFormat" /> - <!-- <el-table-column label="鎶ヨ绾у埆" align="center" prop="alarmLevel" :formatter="alarmLevelFormat"/> + <el-table-column + label="鎸囨爣鍗曚綅" + align="center" + prop="unitId" + :formatter="unitIdFormat" + /> + <!-- <el-table-column label="鎶ヨ绾у埆" align="center" prop="alarmLevel" :formatter="alarmLevelFormat"/> <el-table-column label="闄愬�肩被鍨�" align="center" prop="limitType" :formatter="limitTypeFormat"/> <el-table-column label="闄愬��" align="center" prop="limitingValue"/> <el-table-column label="鏃堕棿璧�" align="center" prop="alarmBeginTime"/> @@ -55,21 +79,38 @@ </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="1500px" :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="1500px" + :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> @@ -82,236 +123,239 @@ </template> <script> +import { + listHistoryAlarm, + exportHistoricalAlarm, + getHistoricalAlarm +} from "@/api/basicsetting/historyAlarm"; +import { listLimitType } from "@/api/basicsetting/limitType"; +import historyAlarmView from "../../energyAlarm/realTimeAlarm/historyAlarmView"; +import historyAlarmTable from "../../energyAlarm/realTimeAlarm/historyAlarmTable"; - import {listHistoryAlarm,exportHistoricalAlarm , getHistoricalAlarm} from "@/api/basicsetting/historyAlarm"; - import {listLimitType} from "@/api/basicsetting/limitType" - import historyAlarmView from "../../energyAlarm/realTimeAlarm/historyAlarmView" - import historyAlarmTable from "../../energyAlarm/realTimeAlarm/historyAlarmTable" +export default { + components: { historyAlarmView, historyAlarmTable }, + name: "historyAlarm", - export default { - components: {historyAlarmView,historyAlarmTable}, - name: 'historyAlarm', - - data() { - return { - num: 20, - num1:5, - pickerOptions: { - /* value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],*/ - }, - code:undefined, - value:'', - options:undefined, - // handleClick:'simple', - radio: 'B', - activeName: 'second', - indexId:undefined, - indexName:undefined, - indexUnit:undefined, - currentNode: '', - limitVal:undefined, - hiddenTableHeader:false, - /* lineChartData: lineChartData.newVisitis,*/ - limitTypeOptions:[], - alarmLevelOptions:[], - resposeList:[], - /* formatDate:undefined,*/ - // 閬僵灞� - 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, - eierarchyFlag:'B', - indexType:'COLLECT', - code: undefined, - indexName:undefined, - /* unitId: undefined,*/ - limitType: undefined, - alarmLevel: undefined, - /*alarmValue:undefined,*/ - /* limitingValue:undefined,*/ - nodeId:undefined, - beginTime: undefined, - endTime:undefined, - - }, - // 琛ㄥ崟鍙傛暟 - form: {}, - // 琛ㄥ崟鏍¢獙 - currentNode: undefined, - indexCategoryDefaultVal: undefined, - unitDefaultVal: undefined - }; + data() { + return { + num: 20, + num1: 5, + pickerOptions: { + /* value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],*/ + }, + code: undefined, + value: "", + options: undefined, + // handleClick:'simple', + radio: "B", + activeName: "second", + indexId: undefined, + indexName: undefined, + indexUnit: undefined, + currentNode: "", + limitVal: undefined, + hiddenTableHeader: false, + /* lineChartData: lineChartData.newVisitis,*/ + limitTypeOptions: [], + alarmLevelOptions: [], + resposeList: [], + /* formatDate:undefined,*/ + // 閬僵灞� + 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, + eierarchyFlag: "B", + indexType: "COLLECT", + code: undefined, + indexName: undefined, + /* unitId: undefined,*/ + limitType: undefined, + alarmLevel: undefined, + /*alarmValue:undefined,*/ + /* limitingValue:undefined,*/ + nodeId: undefined, + beginTime: undefined, + endTime: undefined + }, + // 琛ㄥ崟鍙傛暟 + form: {}, + // 琛ㄥ崟鏍¢獙 + currentNode: undefined, + indexCategoryDefaultVal: undefined, + unitDefaultVal: undefined + }; + }, + created() { + 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: { + getList() { + this.loading = true; + listHistoryAlarm( + this.addDateRange(this.queryParams, this.dateRange) + ).then(response => { + this.JkHistoryAlarmList = response.rows; + this.total = response.total; + this.loading = false; + }); }, - created() { - 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; - }); - + /** 鏌ョ湅鎸夐挳鎿嶄綔 */ + handleUpdate(row) { + this.reset(); + const indexId = row.indexId || this.ids; + this.open = true; + /*this.title = "鍘嗗彶鏁版嵁鏌ヨ";*/ }, - methods: { - - getList() { - this.loading = true; - listHistoryAlarm(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; - /*this.title = "鍘嗗彶鏁版嵁鏌ヨ";*/ - }, - // 鍗曚綅瀛楀吀缈昏瘧 - unitIdFormat(row, column) { - return this.selectDictLabel(this.unitIdOptions, row.unitId); - }, -/* // 闄愬�肩被鍨嬪瓧鍏哥炕璇� + // 鍗曚綅瀛楀吀缈昏瘧 + unitIdFormat(row, column) { + return this.selectDictLabel(this.unitIdOptions, row.unitId); + }, + /* // 闄愬�肩被鍨嬪瓧鍏哥炕璇� limitTypeFormat(row, column) { return this.selectDictLabel(this.limitTypeOptions, row.limitType); },*/ - // 鎶ヨ绾у埆瀛楀吀缈昏瘧 - 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.settingDeviceList = []; - this.settingIndexList = []; - this.disabledSetting = modelNode === undefined || modelNode === '' || modelNode === null; - if (modelNode) { - this.currentNode = modelNode; - this.deviceLoading = true; - this.energyLoading = true; - this.productLoading = true; - this.indexLoading = true; - } - 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; - }, + // 鎶ヨ绾у埆瀛楀吀缈昏瘧 + 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.settingDeviceList = []; + this.settingIndexList = []; + this.disabledSetting = + modelNode === undefined || modelNode === "" || modelNode === null; + if (modelNode) { + this.currentNode = modelNode; + this.deviceLoading = true; + this.energyLoading = true; + this.productLoading = true; + this.indexLoading = true; + } + 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"); + }, - /** 鎼滅储鎸夐挳鎿嶄綔 */ - 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 = this.selectDictLabel(this.unitIdOptions, row.unitId); - this.limitVal = row.limitingValue; - } - }, - /** 瀵煎嚭鎸夐挳鎿嶄綔 */ - handleExport() { - const queryParams = this.queryParams; - this.$confirm('鏄惁纭瀵煎嚭鎵�鏈夋姤璀︽暟鎹」?', "璀﹀憡", { - confirmButtonText: "纭畾", - cancelButtonText: "鍙栨秷", - type: "warning" - }).then(function() { + 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 = this.selectDictLabel(this.unitIdOptions, row.unitId); + this.limitVal = row.limitingValue; + } + }, + /** 瀵煎嚭鎸夐挳鎿嶄綔 */ + handleExport() { + const queryParams = this.queryParams; + this.$confirm("鏄惁纭瀵煎嚭鎵�鏈夋姤璀︽暟鎹」?", "璀﹀憡", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning" + }) + .then(function() { return exportHistoricalAlarm(queryParams); - }).then(response => { + }) + .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; - }, + }) + .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