3 文件已重命名
27个文件已修改
28个文件已添加
9 文件已复制
| New file |
| | |
|---|
| | | const path = require("path"); |
|---|
| | | const fs = require("fs"); |
|---|
| | | |
|---|
| | | // 把 index.html 拷贝到 public 下 |
|---|
| | | fs.copyFileSync( |
|---|
| | | path.resolve("./index.html"), |
|---|
| | | path.resolve("./public/index.html") |
|---|
| | | ); |
|---|
| | |
|---|
| | | <meta charset="utf-8" /> |
|---|
| | | <meta http-equiv="X-UA-Compatible" content="IE=edge" /> |
|---|
| | | <meta name="viewport" content="width=device-width,initial-scale=1.0" /> |
|---|
| | | <title>通信电源监控主站测控系统</title> |
|---|
| | | <title>通信电源监控主站测控系统 <%- title %></title> |
|---|
| | | <%- injectScript %> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <noscript> |
|---|
| | | <strong |
|---|
| | | >We're sorry but 通信电源监控主站测控系统 doesn't work properly without JavaScript |
|---|
| | | enabled. Please enable it to continue.</strong |
|---|
| | | >We're sorry but 通信电源监控主站测控系统 doesn't work properly without |
|---|
| | | JavaScript enabled. Please enable it to continue.</strong |
|---|
| | | > |
|---|
| | | </noscript> |
|---|
| | | <div id="app"></div> |
|---|
| | | <!-- <script type="module"> |
|---|
| | | import "./src/main.js"; |
|---|
| | | </script> --> |
|---|
| | | <script type="module" src="./src/main.js" ></script> |
|---|
| | | <!-- <script type="module" src="./src/main.js" ></script> --> |
|---|
| | | <!-- built files will be auto injected --> |
|---|
| | | </body> |
|---|
| | | </html> |
|---|
| | |
|---|
| | | "version": "0.1.0", |
|---|
| | | "private": true, |
|---|
| | | "scripts": { |
|---|
| | | "_preserve": "node ./command/html.js", |
|---|
| | | "preserve": "set NODE_OPTIONS=--openssl-legacy-provider", |
|---|
| | | "prebuild": "node ./command/html.js", |
|---|
| | | "serve": "vue-cli-service serve", |
|---|
| | | "build": "vue-cli-service build", |
|---|
| | | "lint": "vue-cli-service lint", |
|---|
| New file |
| | |
|---|
| | | <!DOCTYPE html> |
|---|
| | | <html lang=""> |
|---|
| | | <head> |
|---|
| | | <meta charset="utf-8" /> |
|---|
| | | <meta http-equiv="X-UA-Compatible" content="IE=edge" /> |
|---|
| | | <meta name="viewport" content="width=device-width,initial-scale=1.0" /> |
|---|
| | | <link rel="icon" href="<%= BASE_URL %>favicon.ico"> |
|---|
| | | <title><%= htmlWebpackPlugin.options.title %></title> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <noscript> |
|---|
| | | <strong |
|---|
| | | >We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without |
|---|
| | | JavaScript enabled. Please enable it to continue.</strong |
|---|
| | | > |
|---|
| | | </noscript> |
|---|
| | | <div id="app"></div> |
|---|
| | | <!-- <script type="module" src="./src/main.js" ></script> --> |
|---|
| | | <!-- built files will be auto injected --> |
|---|
| | | </body> |
|---|
| | | </html> |
|---|
| | |
|---|
| | | color: #fff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .dib { |
|---|
| | | display: inline-block; |
|---|
| | | } |
|---|
| | | .flex-c { |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | |
|---|
| | | /** |
|---|
| | | * 将整数转为二进制数 并输出每一位的值到数组中 从高位到低位 二进制位数可指定 （多的裁切 不够的补0） |
|---|
| | | * 将整数转为二进制数 并输出每一位的值到数组中 从低位到高位 二进制位数可指定 （多的裁切 不够的补0） |
|---|
| | | */ |
|---|
| | | export default function getBinaryDigits(num = 0, bits = 25) { |
|---|
| | | // 将数值转换为二进制字符串 |
|---|
| New file |
| | |
|---|
| | | <script> |
|---|
| | | import ECharts from "echarts"; |
|---|
| | | import BaseChart from "@/components/echarts/BaseChart"; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | extends: BaseChart, |
|---|
| | | props: { |
|---|
| | | name: { |
|---|
| | | type: String, |
|---|
| | | default: "", |
|---|
| | | }, |
|---|
| | | unit: { |
|---|
| | | type: String, |
|---|
| | | default: "", |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | fullScreen() { |
|---|
| | | return false; |
|---|
| | | }, |
|---|
| | | |
|---|
| | | setData(data) { |
|---|
| | | let option = this.getOption(data); |
|---|
| | | this.setOption(option); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | getOption(data = []) { |
|---|
| | | const unit = this.unit; |
|---|
| | | let xLabel = []; |
|---|
| | | let sData = []; |
|---|
| | | data.forEach((v) => { |
|---|
| | | xLabel.push(v.time); |
|---|
| | | sData.push(v.value); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | return { |
|---|
| | | grid: { |
|---|
| | | left: '2%', |
|---|
| | | right: '2%', |
|---|
| | | bottom: "2%", |
|---|
| | | top: '10%', |
|---|
| | | containLabel: true, |
|---|
| | | }, |
|---|
| | | // tooltip: {}, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'axis', // 'axis' 表示在数据轴上触发悬停 |
|---|
| | | // axisPointer: { // 指示器，有以下三种选择： |
|---|
| | | // type: 'line' // 'line'、'shadow' |
|---|
| | | // }, |
|---|
| | | formatter(params) { |
|---|
| | | return params[0].name + '<br >' + (params[0].value + unit); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | type: "category", |
|---|
| | | data: xLabel, |
|---|
| | | axisPointer: { |
|---|
| | | type: "shadow" |
|---|
| | | }, |
|---|
| | | // axisLine: { |
|---|
| | | // show: false, // 隐藏x轴轴线 |
|---|
| | | // }, |
|---|
| | | // axisTick: { |
|---|
| | | // show: false, // 隐藏x轴刻度线 |
|---|
| | | // }, |
|---|
| | | axisLabel: { |
|---|
| | | show: true, // 显示分类名 |
|---|
| | | position: "inside", // 将分类名放置在x轴内部 |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | yAxis: { |
|---|
| | | type: "value", |
|---|
| | | name: unit, |
|---|
| | | nameLocation: 'end', |
|---|
| | | nameTextStyle: { |
|---|
| | | align: "center", |
|---|
| | | verticalAlign: "top" |
|---|
| | | }, |
|---|
| | | // show: false, |
|---|
| | | min: function (data) { |
|---|
| | | let min = data.min; |
|---|
| | | if (min == Infinity) { |
|---|
| | | return 0; |
|---|
| | | } |
|---|
| | | return Math.min(Math.round((min - min * 0.15) * 100) / 100, 0); |
|---|
| | | }, |
|---|
| | | max: function (data) { |
|---|
| | | let max = data.max; |
|---|
| | | if (max == -Infinity) { |
|---|
| | | max = 1; |
|---|
| | | } |
|---|
| | | return Math.round((max + max * 0.15) * 100) / 100; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | data: sData, |
|---|
| | | type: "bar", |
|---|
| | | label: { |
|---|
| | | show: true, |
|---|
| | | position: 'top', |
|---|
| | | } |
|---|
| | | // connectNulls: true, |
|---|
| | | // symbolSize: 0 |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | this.setData([{ |
|---|
| | | time: '12:02:34', |
|---|
| | | value: 229 |
|---|
| | | }, { |
|---|
| | | time: '12:29:34', |
|---|
| | | value: 210 |
|---|
| | | }]); |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | |
|---|
| | | tooltip: { |
|---|
| | | formatter: (params) => { |
|---|
| | | if (params.name !== "") { |
|---|
| | | return params.name + " : " + sData[params.dataIndex]; |
|---|
| | | return params.name + " : " + sData[params.dataIndex] + unit; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | textStyle: { |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | big = big || 1; |
|---|
| | | for (let i = 0; i < sData.length; i++) { |
|---|
| | | getmydzd.push(big * 4); |
|---|
| | | } |
|---|
| | |
|---|
| | | tooltip: { |
|---|
| | | formatter: (params) => { |
|---|
| | | if (params.name !== "") { |
|---|
| | | return params.name + " : " + sData[params.dataIndex]; |
|---|
| | | return params.name + " : " + sData[params.dataIndex] + unit; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | textStyle: { |
|---|
| | |
|---|
| | | height: 28px; |
|---|
| | | display: flex; |
|---|
| | | background-color: #fff; |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | .ip-segment { |
|---|
| | | height: 26px; |
|---|
| | | flex: 1; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | .inner { |
|---|
| | | display: flex; |
|---|
| | | flex: 1; |
|---|
| | |
|---|
| | | i { |
|---|
| | | font-size: 18px; |
|---|
| | | font-weight: 700; |
|---|
| | | // line-height: 2; |
|---|
| | | color: #000; |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | color: #00f7f8; |
|---|
| | | font-size: 20px; |
|---|
| | | line-height: 42px; |
|---|
| | | background: url("images/panel-title.png") 50% 50% / auto 100% no-repeat; |
|---|
| | | background: url("../assets/images/panel-title.png") 50% 50% / auto 100% no-repeat; |
|---|
| | | } |
|---|
| | | .panel-content { |
|---|
| | | flex: 1; |
|---|
| | |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return {}; |
|---|
| | | let xLabel = []; |
|---|
| | | let oData = []; |
|---|
| | | for (let i = 0, j = 24 * 60 * 60; i < j; i++) { |
|---|
| | | xLabel.push(this.convertSecsToTime(i)); |
|---|
| | | oData.push(0); |
|---|
| | | } |
|---|
| | | return { |
|---|
| | | xLabel, |
|---|
| | | oData, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | convertSecsToTime(sec) { |
|---|
| | | let h, m, s; |
|---|
| | | |
|---|
| | | m = Math.floor(sec / 60); |
|---|
| | | s = sec % 60; |
|---|
| | | |
|---|
| | | h = Math.floor(m / 60); |
|---|
| | | m = m % 60; |
|---|
| | | |
|---|
| | | // 将小时、分钟和秒转换为两位数 |
|---|
| | | h = (h < 10) ? "0" + h : h; |
|---|
| | | m = (m < 10) ? "0" + m : m; |
|---|
| | | s = (s < 10) ? "0" + s : s; |
|---|
| | | |
|---|
| | | return h + ":" + m + ":" + s; |
|---|
| | | }, |
|---|
| | | convertTimeToSecs(time) { |
|---|
| | | let [h, m, s] = time.split(':').map(v => v * 1); |
|---|
| | | return h * 60 * 60 + m * 60 + s; |
|---|
| | | }, |
|---|
| | | fullScreen() { |
|---|
| | | return false; |
|---|
| | | }, |
|---|
| | |
|---|
| | | this.setOption(option); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | getOption(data) { |
|---|
| | | // let xLabel = data.xLabel; |
|---|
| | | getOption(data = []) { |
|---|
| | | let xLabel = this.xLabel; |
|---|
| | | let rdata = JSON.parse(JSON.stringify(this.oData)); |
|---|
| | | // let sData = data.sData; |
|---|
| | | // data = [{ time: '12:30:05', flag: 0 }, { time: '12:50:05', flag: 1 }, { time: '13:30:05', flag: 1 }, { time: '16:30:05', flag: 0 }]; |
|---|
| | | // 获取初始状态 如果有操作 根据第一次操作来定初始状态 没有操作 则认定初始状态为分闸状态 |
|---|
| | | let lastFlag = 0; |
|---|
| | | let lastSec = 0; |
|---|
| | | if (data[0]) { |
|---|
| | | lastFlag = !data[0].flag * 1; |
|---|
| | | } |
|---|
| | | |
|---|
| | | data.forEach((v, i) => { |
|---|
| | | // rdata[this.convertTimeToSecs(v.time)] = v.flag; |
|---|
| | | let { time, flag } = v; |
|---|
| | | let sec = this.convertTimeToSecs(time); |
|---|
| | | // 上一次的状态为合闸 就要一直补合闸状态到下一次状态改变 |
|---|
| | | if (lastFlag) { |
|---|
| | | rdata.fill(1, lastSec, sec); |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 如果是最后一笔 且为合闸操作 则要补状态到结束 |
|---|
| | | if (i == data.length - 1 && flag) { |
|---|
| | | rdata.fill(1, lastSec); |
|---|
| | | } |
|---|
| | | lastFlag = flag; |
|---|
| | | lastSec = sec; |
|---|
| | | }); |
|---|
| | | // rdata.forEach((v, i) => { |
|---|
| | | |
|---|
| | | // }); |
|---|
| | | |
|---|
| | | return { |
|---|
| | | grid: { |
|---|
| | | left: 0, |
|---|
| | | right: 0, |
|---|
| | | bottom: "2%", |
|---|
| | | top: "2%", |
|---|
| | | left: '2%', |
|---|
| | | right: '2%', |
|---|
| | | bottom: "6%", |
|---|
| | | top: "6%", |
|---|
| | | containLabel: true, |
|---|
| | | }, |
|---|
| | | tooltip: {}, |
|---|
| | | // tooltip: {}, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'axis', // 'axis' 表示在数据轴上触发悬停 |
|---|
| | | axisPointer: { // 指示器，有以下三种选择： |
|---|
| | | type: 'line' // 'line'、'shadow' |
|---|
| | | }, |
|---|
| | | formatter(params) { |
|---|
| | | return params[0].name + '<br >' + (params[0].value ? '合闸' : '分闸'); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | type: "category", |
|---|
| | | data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], |
|---|
| | | onZero: false, |
|---|
| | | data: xLabel, |
|---|
| | | // onZero: false, |
|---|
| | | axisPointer: { |
|---|
| | | type: "line" |
|---|
| | | }, |
|---|
| | | axisLine: { |
|---|
| | | show: false, // 隐藏x轴轴线 |
|---|
| | | }, |
|---|
| | |
|---|
| | | }, |
|---|
| | | yAxis: { |
|---|
| | | type: "value", |
|---|
| | | min: -0.1, |
|---|
| | | axisLine: { |
|---|
| | | show: false, |
|---|
| | | }, |
|---|
| | | min: -0.5, |
|---|
| | | max: 1.5, |
|---|
| | | interval: 0.5, |
|---|
| | | // minInterval: 1, |
|---|
| | | axisLabel: { |
|---|
| | | formatter: function (value, index) { |
|---|
| | | switch (value) { |
|---|
| | | case 0: |
|---|
| | | return '分闸'; |
|---|
| | | case 1: |
|---|
| | | return '合闸'; |
|---|
| | | default: |
|---|
| | | return ''; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // show: false, |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | data: [1, 0, 0, 1, 0, 1, 0], |
|---|
| | | data: rdata, |
|---|
| | | type: "line", |
|---|
| | | step: "center", |
|---|
| | | connectNulls: true, |
|---|
| | | step: "middle", |
|---|
| | | // connectNulls: true, |
|---|
| | | symbolSize: 0 |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | toolbox: { |
|---|
| | | show: true, |
|---|
| | | feature: { |
|---|
| | | dataZoom: { |
|---|
| | | yAxisIndex: "none" |
|---|
| | | }, |
|---|
| | | // dataView: { |
|---|
| | | // readOnly: false |
|---|
| | | // }, |
|---|
| | | // magicType: { |
|---|
| | | // type: ["line", "bar"] |
|---|
| | | // }, |
|---|
| | | restore: {}, |
|---|
| | | // saveAsImage: {} |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | dataZoom: [ |
|---|
| | | { |
|---|
| | | type: "inside", |
|---|
| | | show: true, |
|---|
| | | height: 15, |
|---|
| | | start: 1, |
|---|
| | | start: 0, |
|---|
| | | end: 100, |
|---|
| | | orient: "vertical", |
|---|
| | | orient: "horizontal", |
|---|
| | | zlevel: 66, |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // type: "slider", |
|---|
| | | // show: true, |
|---|
| | | // height: 15, |
|---|
| | | // start: 0, |
|---|
| | | // end: 100, |
|---|
| | | // orient: "horizontal", |
|---|
| | | // zlevel: 66, |
|---|
| | | // }, |
|---|
| | | ], |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | |
|---|
| | | <div class="left"> |
|---|
| | | <div class="box"> |
|---|
| | | 分闸开关 |
|---|
| | | <div class="num">12</div> |
|---|
| | | <div class="num">{{ onSwitch }}</div> |
|---|
| | | </div> |
|---|
| | | <div class="box">合闸开关<div class="num">22</div></div> |
|---|
| | | <div class="box"> |
|---|
| | | 合闸开关 |
|---|
| | | <div class="num">{{ offSwitch }}</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <!-- 右边 --> |
|---|
| | | <div class="right"> |
|---|
| | | <div class="box"> |
|---|
| | | <!-- <div class="box"> |
|---|
| | | 开关告警数 |
|---|
| | | <div class="num">4</div> |
|---|
| | | </div> |
|---|
| | | <div class="box"> |
|---|
| | | 跳闸开关 |
|---|
| | | <div class="num">12</div> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | <div class="state">{{ isTimeout ? "离线" : "在线" }}</div> |
|---|
| | | <div :class="['i', { danger: isTimeout }]"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="right-menu"> |
|---|
| | |
|---|
| | | import { mapGetters } from "vuex"; |
|---|
| | | // import Hamburger from '@/components/Hamburger' |
|---|
| | | import PwdChange from "./PwdChange"; |
|---|
| | | |
|---|
| | | import createWs from "@/assets/js/websocket/plus"; |
|---|
| | | const WSMixin = createWs("switch"); |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | mixins: [WSMixin], |
|---|
| | | components: { |
|---|
| | | // Hamburger, |
|---|
| | | PwdChange, |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | ...mapGetters(["sidebar", "avatar", "device", "name"]), |
|---|
| | | isTimeout() { |
|---|
| | | let time = new Date(this.recordTime).getTime(); |
|---|
| | | let stamp = new Date(this.nowTime).getTime(); |
|---|
| | | |
|---|
| | | return Math.abs(time - stamp) > 2 * 60 * 1000; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | onSwitch: 0, |
|---|
| | | offSwitch: 0, |
|---|
| | | recordTime: -200 * 1000, |
|---|
| | | nowTime: 0, |
|---|
| | | changePwdVisible: false, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { |
|---|
| | | data: { onSwitch, offSwitch, recordTime, nowTime }, |
|---|
| | | } = JSON.parse(res.data); |
|---|
| | | // console.log(data, "=====data??", data2); |
|---|
| | | this.onSwitch = onSwitch; |
|---|
| | | this.offSwitch = offSwitch; |
|---|
| | | this.recordTime = recordTime; |
|---|
| | | this.nowTime = nowTime; |
|---|
| | | }, |
|---|
| | | changePwd() { |
|---|
| | | this.changePwdVisible = true; |
|---|
| | | }, |
|---|
| | |
|---|
| | | overflow: hidden; |
|---|
| | | position: relative; |
|---|
| | | color: #fff; |
|---|
| | | background: #011f39 url("images/header-bg.png") 50% 50% / auto 100% no-repeat; |
|---|
| | | background: #011f39 url("../../assets/images/header-bg.png") 50% 50% / auto |
|---|
| | | 100% no-repeat; |
|---|
| | | box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08); |
|---|
| | | .title { |
|---|
| | | font-size: 34px; |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .i { |
|---|
| | | margin-left: 20px; |
|---|
| | | display: inline-block; |
|---|
| | | width: 20px; |
|---|
| | | height: 20px; |
|---|
| | | border-radius: 50%; |
|---|
| | | background: radial-gradient( |
|---|
| | | circle farthest-side at 50% 50%, |
|---|
| | | rgba(1, 31, 57, 0.5) 50%, |
|---|
| | | rgba(74, 253, 136, 0.5) 100% |
|---|
| | | ); |
|---|
| | | text-align: center; |
|---|
| | | position: relative; |
|---|
| | | &::after { |
|---|
| | | content: ""; |
|---|
| | | display: inline-block; |
|---|
| | | position: absolute; |
|---|
| | | border-radius: 50%; |
|---|
| | | top: 4px; |
|---|
| | | right: 4px; |
|---|
| | | bottom: 4px; |
|---|
| | | left: 4px; |
|---|
| | | background: #4afd88; |
|---|
| | | } |
|---|
| | | &.danger { |
|---|
| | | background: radial-gradient( |
|---|
| | | circle farthest-side at 50% 50%, |
|---|
| | | rgba(1, 31, 57, 0.5) 50%, |
|---|
| | | rgba(255, 56, 1, 0.5) 100% |
|---|
| | | ); |
|---|
| | | &::after { |
|---|
| | | background: #ff3801; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | |
|---|
| | | this.close(); |
|---|
| | | alert("密码更新成功,请重新登录！"); |
|---|
| | | this.$store.dispatch("user/logout"); |
|---|
| | | // this.$router.push("/login"); |
|---|
| | | this.$router.push("/login"); |
|---|
| | | } else { |
|---|
| | | this.$layer.msg(msg); |
|---|
| | | } |
|---|
| | |
|---|
| | | mounted() { |
|---|
| | | if (this.uid > 1000) { |
|---|
| | | this.menus = this.menus.filter( |
|---|
| | | (v) => !["/user"].some((vv) => vv == v.path) |
|---|
| | | (v) => !["/system"].some((vv) => vv == v.path) |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | |
|---|
| | | border-right: 1px solid #77EEF7; |
|---|
| | | .el-menu { |
|---|
| | | padding: 0 6px; |
|---|
| | | min-width: 20em; |
|---|
| | | /deep/ .el-menu-item { |
|---|
| | | border-radius: 6px; |
|---|
| | | } |
|---|
| | |
|---|
| | | // if is logged in, redirect to the home page |
|---|
| | | next({ path: "/" }); |
|---|
| | | NProgress.done(); |
|---|
| | | } else if (to.path === "/user/list") { |
|---|
| | | } else if (to.path.indexOf("/system/") > -1 ) { |
|---|
| | | if (isAdmin) { |
|---|
| | | next(); |
|---|
| | | } else { |
|---|
| | |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: "/switchcontrol", |
|---|
| | | path: "/controls", |
|---|
| | | component: Layout, |
|---|
| | | meta: { title: "交流/直流微断测控", icon: 'dashboard'}, |
|---|
| | | name: "switchControl", |
|---|
| | | meta: { title: "主站测控", icon: 'dashboard'}, |
|---|
| | | name: "controls", |
|---|
| | | children: [ |
|---|
| | | { |
|---|
| | | path: '', |
|---|
| | | path: 'switch', |
|---|
| | | component: () => import('@/views/switchControl'), |
|---|
| | | name: 'switchControl', |
|---|
| | | meta: {title: '交流/直流微断测控', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: "/power-cabinet-control", |
|---|
| | | component: Layout, |
|---|
| | | meta: { title: "通信电源柜测控", icon: 'dashboard'}, |
|---|
| | | name: "powerCabinetControl", |
|---|
| | | children: [ |
|---|
| | | { |
|---|
| | | path: '', |
|---|
| | | path: 'power-cabinet', |
|---|
| | | component: () => import('@/views/powerCabinetControl'), |
|---|
| | | name: 'powerCabinetControl', |
|---|
| | | meta: {title: '通信电源柜测控', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: 'hr-cabinet', |
|---|
| | | component: () => import('@/views/hrControl'), |
|---|
| | | name: 'hrControl', |
|---|
| | | meta: {title: '核容装置模拟测控', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: "/power-cabinet-rtalarm", |
|---|
| | | path: "/data-record", |
|---|
| | | component: Layout, |
|---|
| | | meta: { title: "电源柜实时告警", icon: 'dashboard'}, |
|---|
| | | name: "powerCabinetRtalarm", |
|---|
| | | meta: { title: "数据管理", icon: 'dashboard'}, |
|---|
| | | name: "dataRecord", |
|---|
| | | children: [ |
|---|
| | | { |
|---|
| | | path: '', |
|---|
| | | path: 'disjunctor', |
|---|
| | | component: () => import('@/views/disjunctorTestRecord'), |
|---|
| | | name: 'disjunctorTestRecord', |
|---|
| | | meta: {title: '交直流断路测控记录', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: 'disjunctor-details', |
|---|
| | | component: () => import('@/views/disjunctorTestRecord/details'), |
|---|
| | | name: 'disjunctorTestDetails', |
|---|
| | | hidden: true, |
|---|
| | | meta: {title: '交直流断路测控详情', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: 'power', |
|---|
| | | component: () => import('@/views/powerTestRecord'), |
|---|
| | | name: 'powerTestRecord', |
|---|
| | | meta: {title: '通信电源测控记录', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: 'power-details', |
|---|
| | | component: () => import('@/views/powerTestRecord/details'), |
|---|
| | | name: 'powerTestDetails', |
|---|
| | | hidden: true, |
|---|
| | | meta: {title: '通信电源测控详情', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: 'hr', |
|---|
| | | component: () => import('@/views/hrTestRecord'), |
|---|
| | | name: 'hrTestRecord', |
|---|
| | | meta: {title: '核容装置模拟测控记录', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // path: 'hr-details', |
|---|
| | | // component: () => import('@/views/hrTestRecord/details'), |
|---|
| | | // name: 'hrTestDetails', |
|---|
| | | // hidden: true, |
|---|
| | | // meta: {title: '通信电源测控详情', icon: 'dashboard'} |
|---|
| | | // }, |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: "/alarms", |
|---|
| | | component: Layout, |
|---|
| | | meta: { title: "告警管理", icon: 'dashboard'}, |
|---|
| | | name: "alarms", |
|---|
| | | children: [ |
|---|
| | | // { |
|---|
| | | // path: 'switch-rt', |
|---|
| | | // component: () => import('@/views/disjunctorRtalarm'), |
|---|
| | | // name: 'disjunctorRtalarm', |
|---|
| | | // meta: {title: '交直流断路器实时告警', icon: 'dashboard'} |
|---|
| | | // }, |
|---|
| | | // { |
|---|
| | | // path: 'switch-his', |
|---|
| | | // component: () => import('@/views/disjunctorHisalarm'), |
|---|
| | | // name: 'disjunctorHisalarm', |
|---|
| | | // meta: {title: '交直流断路器历史告警', icon: 'dashboard'} |
|---|
| | | // }, |
|---|
| | | // { |
|---|
| | | // path: 'switch-settings', |
|---|
| | | // component: () => import('@/views/disjunctorSettings'), |
|---|
| | | // name: 'disjunctorSettings', |
|---|
| | | // meta: {title: '交直流断路器告警设置', icon: 'dashboard'} |
|---|
| | | // }, |
|---|
| | | { |
|---|
| | | path: 'power-rt', |
|---|
| | | component: () => import('@/views/powerCabinetRtalarm'), |
|---|
| | | name: 'powerCabinetRtalarm', |
|---|
| | | meta: {title: '电源柜实时告警', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: "/power-cabinet-hisalarm", |
|---|
| | | component: Layout, |
|---|
| | | meta: { title: "电源柜历史告警", icon: 'dashboard'}, |
|---|
| | | name: "powerCabinetHisalarm", |
|---|
| | | children: [ |
|---|
| | | { |
|---|
| | | path: '', |
|---|
| | | path: 'power-his', |
|---|
| | | component: () => import('@/views/powerCabinetHisalarm'), |
|---|
| | | name: 'powerCabinetHisalarm', |
|---|
| | | meta: {title: '电源柜历史告警', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: 'hr-rt', |
|---|
| | | component: () => import('@/views/devRtalarm'), |
|---|
| | | name: 'devRtalarm', |
|---|
| | | meta: {title: '核容装置实时告警', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: 'hr-his', |
|---|
| | | component: () => import('@/views/devHisalarm'), |
|---|
| | | name: 'devHisalarm', |
|---|
| | | meta: {title: '核容装置历史告警', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: "/test-record", |
|---|
| | | path: "/device-management", |
|---|
| | | component: Layout, |
|---|
| | | meta: { title: "交直流断路测控记录", icon: 'dashboard'}, |
|---|
| | | name: "testRecord", |
|---|
| | | meta: { title: "设备管理", icon: 'dashboard'}, |
|---|
| | | name: "dataRecord", |
|---|
| | | children: [ |
|---|
| | | { |
|---|
| | | path: '', |
|---|
| | | component: () => import('@/views/testRecord'), |
|---|
| | | name: 'testRecord', |
|---|
| | | meta: {title: '交直流断路测控记录', icon: 'dashboard'} |
|---|
| | | path: 'gateway', |
|---|
| | | component: () => import('@/views/devManager/gateway'), |
|---|
| | | name: 'gateway', |
|---|
| | | meta: {title: '网关信息管理', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: 'details', |
|---|
| | | component: () => import('@/views/testRecord/details'), |
|---|
| | | name: 'testDetails', |
|---|
| | | hidden: true, |
|---|
| | | meta: {title: '交直流断路测控详情', icon: 'dashboard'} |
|---|
| | | path: 'switch', |
|---|
| | | component: () => import('@/views/devManager/switch'), |
|---|
| | | name: 'devSwitch', |
|---|
| | | meta: {title: '交直流微断信息管理', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: "/user", |
|---|
| | | path: "/system", |
|---|
| | | component: Layout, |
|---|
| | | redirect: '/user/list', |
|---|
| | | meta: { title: "用户", icon: 'dashboard'}, |
|---|
| | | // redirect: '/user/list', |
|---|
| | | meta: { title: "系统管理", icon: 'dashboard'}, |
|---|
| | | name: "users", |
|---|
| | | children: [ |
|---|
| | | { |
|---|
| | | path: 'list', |
|---|
| | | path: 'user', |
|---|
| | | component: () => import('@/views/user/list'), |
|---|
| | | name: 'userList', |
|---|
| | | meta: {title: '用户', icon: 'dashboard'} |
|---|
| | | meta: {title: '用户信息管理', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: 'logs', |
|---|
| | | component: () => import('@/views/logs'), |
|---|
| | | name: 'userList', |
|---|
| | | meta: {title: '日志事件管理', icon: 'dashboard'} |
|---|
| | | }, |
|---|
| | | ] |
|---|
| | | }, |
|---|
copy from src/views/testRecord/index.vue
copy to src/views/devHisalarm/index.vue
| File was copied from src/views/testRecord/index.vue |
| | |
|---|
| | | <template> |
|---|
| | | <div class="p-main flex-c"> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <el-button class="btn-alarm levelall" @click="changeLevel(0)" |
|---|
| | | >全部告警 |
|---|
| | | <div class="num">{{ almCount[0] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level0" @click="changeLevel(3)" |
|---|
| | | >紧急 |
|---|
| | | <div class="num">{{ almCount[3] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level1" @click="changeLevel(2)" |
|---|
| | | >重大 |
|---|
| | | <div class="num">{{ almCount[2] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level2" @click="changeLevel(1)" |
|---|
| | | >一般 |
|---|
| | | <div class="num">{{ almCount[1] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm type" @click="changeType(1)" |
|---|
| | | >交流配电柜 |
|---|
| | | <div class="num">{{ almCount["ac"] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm type" @click="changeType(2)" |
|---|
| | | >直流配电柜 |
|---|
| | | <div class="num">{{ almCount["dc"] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm type" @click="changeType(3)" |
|---|
| | | >高频开关电源柜 |
|---|
| | | <div class="num">{{ almCount["gc"] }}</div> |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | <panel class="panel p-content"> |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测控线路</div> |
|---|
| | | <div class="label">告警名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="devType" |
|---|
| | | v-model="almName" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | filterable |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in devtypes" |
|---|
| | | :key="'type_' + idx" |
|---|
| | | v-for="(item, idx) in almNames" |
|---|
| | | :key="'name_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="idx" |
|---|
| | | > |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">断路器名称</div> |
|---|
| | | <div class="label">告警等级</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="almLevel" |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测控日期</div> |
|---|
| | | <div class="label">告警开始时间</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-date-picker |
|---|
| | | v-model="date1" |
|---|
| | |
|---|
| | | show-overflow-tooltip |
|---|
| | | align="center" |
|---|
| | | ></el-table-column> |
|---|
| | | <el-table-column label="确认告警" width="120" align="center"> |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-checkbox |
|---|
| | | :value="!!scope.row.almIsConfirmed" |
|---|
| | | disabled |
|---|
| | | ></el-checkbox> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | <el-table-column |
|---|
| | | prop="cztime" |
|---|
| | | fixed="right" |
|---|
| | |
|---|
| | | <el-button |
|---|
| | | class="yellow" |
|---|
| | | size="mini" |
|---|
| | | @click="details(scope.row)" |
|---|
| | | >详情</el-button |
|---|
| | | @click="confirmAlarm(scope.row)" |
|---|
| | | >确认告警</el-button |
|---|
| | | > |
|---|
| | | <!-- <el-button class="l-green" disabled="" size="mini" |
|---|
| | | >告警详情</el-button |
|---|
| | |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "devName", |
|---|
| | | label: "断路器位置", |
|---|
| | | label: "设备名称", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almName", |
|---|
| | | label: "断路器名称", |
|---|
| | | label: "告警名称", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | | label: "测控日期", |
|---|
| | | label: "告警等级", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almStartTime", |
|---|
| | | label: "动作总次数", |
|---|
| | | label: "告警开始时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almConfirmedTime", |
|---|
| | | label: "合闸次数", |
|---|
| | | label: "告警确认时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almIsConfirmed", |
|---|
| | | label: "分闸次数", |
|---|
| | | width: 120, |
|---|
| | | prop: "almConfirmedTime", |
|---|
| | | label: "告警结束时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // prop: "almIsConfirmed", |
|---|
| | | // label: "确认告警", |
|---|
| | | // width: 120, |
|---|
| | | // }, |
|---|
| | | ], |
|---|
| | | datas: [ |
|---|
| | | { |
|---|
| | | devName: 1, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | datas: [], |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | details() { |
|---|
| | | this.$router.push("/test-record/details"); |
|---|
| | | changeLevel(level) { |
|---|
| | | this.almLevel = level; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | changeType(value) { |
|---|
| | | this.devType = value; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { |
|---|
copy from src/views/testRecord/js/apis.js
copy to src/views/devHisalarm/js/apis.js
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class=""> |
|---|
| | | <el-form ref="form" :model="form" :rules="rules" label-width="80px"> |
|---|
| | | <el-form-item label="网关名称" prop="gatewayName" required> |
|---|
| | | <el-input size="mini" v-model="form.gatewayName"></el-input> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="网关类别" prop="gatewayType" ref="gateWay" required> |
|---|
| | | <el-select v-model="form.gatewayType" filterable allow-create @blur="selectBlur('gateWay')" size="mini" |
|---|
| | | placeholder="请选择"> |
|---|
| | | <el-option v-for="(item, idx) in gatewayTypes" :key="'type_' + idx" :label="item" :value="item"> |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="ip地址" prop="ipAddr" required ref="addr"> |
|---|
| | | <div class="dib"> |
|---|
| | | <ip-input class="input" :onBlur="blur" :ip="form.ipAddr"></ip-input> |
|---|
| | | </div> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="通信协议" ref="commType" prop="commType" required> |
|---|
| | | <el-select v-model="form.commType" filterable allow-create @blur="selectBlur('commType')" size="mini" |
|---|
| | | placeholder="请选择"> |
|---|
| | | <el-option v-for="(item, idx) in commTypes" :key="'type_' + idx" :label="item" :value="item"> |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item> |
|---|
| | | <el-button v-if="isEdit" type="primary" @click="update">修改</el-button> |
|---|
| | | <el-button v-else type="primary" @click="onSubmit">新增</el-button> |
|---|
| | | <el-button @click="close">取消</el-button> |
|---|
| | | </el-form-item> |
|---|
| | | </el-form> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import IpInput from "@/components/ipInput.vue"; |
|---|
| | | import { getGatewayType, getCommType, updateGateway, addGateway } from "./js/apis"; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | props: { |
|---|
| | | info: { |
|---|
| | | type: Object, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | rules: { |
|---|
| | | gatewayName: [ |
|---|
| | | { required: true, message: '请输入网关名称', trigger: 'blur' }, |
|---|
| | | ], |
|---|
| | | commType: [ |
|---|
| | | { required: true, message: '请输入通信协议', trigger: 'blur' } |
|---|
| | | ], |
|---|
| | | gatewayType: [ |
|---|
| | | { required: true, message: '请输入网关类别', trigger: 'blur' }, |
|---|
| | | ], |
|---|
| | | ipAddr: [ |
|---|
| | | { required: true, message: '请输入ip地址', trigger: 'blur' } |
|---|
| | | ], |
|---|
| | | }, |
|---|
| | | atewayTypes: [], |
|---|
| | | commTypes: [], |
|---|
| | | form: { |
|---|
| | | commType: '', |
|---|
| | | gatewayType: '', |
|---|
| | | gatewayName: "", |
|---|
| | | ipAddr: "", |
|---|
| | | num: undefined |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | isEdit() { |
|---|
| | | return !!this.info; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | components: { |
|---|
| | | IpInput, |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | blur(value) { |
|---|
| | | let segments = value.split("."); |
|---|
| | | if (!segments.some((v) => v == "")) { |
|---|
| | | this.form.ipAddr = value; |
|---|
| | | } else { |
|---|
| | | this.form.ipAddr = ""; |
|---|
| | | } |
|---|
| | | // console.log(value, 'v'); |
|---|
| | | // console.log(this.form.ipAddr); |
|---|
| | | this.$refs.addr.$emit('el.form.blur'); |
|---|
| | | }, |
|---|
| | | selectBlur(refName) { |
|---|
| | | this.$refs[refName].$emit('el.form.blur'); |
|---|
| | | }, |
|---|
| | | getGatewayType() { |
|---|
| | | getGatewayType().then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.gatewayTypes = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | getCommType() { |
|---|
| | | getCommType().then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.commTypes = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | close() { |
|---|
| | | this.$emit("cancel"); |
|---|
| | | }, |
|---|
| | | update() { |
|---|
| | | this.$refs.form.validate((valid) => { |
|---|
| | | if (valid) { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | updateGateway(this.form) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | this.$emit("success"); |
|---|
| | | this.$message.success("操作成功"); |
|---|
| | | } else { |
|---|
| | | this.$message.error("操作失败"); |
|---|
| | | } |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }); |
|---|
| | | } else { |
|---|
| | | this.$message.error('存在未验证通过的数据'); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | onSubmit() { |
|---|
| | | this.$refs.form.validate((valid) => { |
|---|
| | | if (valid) { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | addGateway(this.form) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | this.$emit("success"); |
|---|
| | | this.$message.success("操作成功"); |
|---|
| | | } else { |
|---|
| | | this.$message.error("操作失败"); |
|---|
| | | } |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }); |
|---|
| | | } else { |
|---|
| | | this.$message.error('存在未验证通过的数据'); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() { |
|---|
| | | this.getGatewayType(); |
|---|
| | | this.getCommType(); |
|---|
| | | // console.log(this.info, 'info') |
|---|
| | | if (this.info) { |
|---|
| | | this.form.gatewayType = this.info.gatewayType; |
|---|
| | | this.form.commType = this.info.commType; |
|---|
| | | this.form.gatewayName = this.info.gatewayName; |
|---|
| | | this.form.num = this.info.num; |
|---|
| | | this.form.ipAddr = this.info.ipAddr; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .input { |
|---|
| | | color: #000; |
|---|
| | | border: 1px #cccccc solid; |
|---|
| | | flex: 1; |
|---|
| | | border-radius: 6px; |
|---|
| | | margin-left: 6px; |
|---|
| | | margin-right: 6px; |
|---|
| | | |
|---|
| | | /deep/ .el-input__inner { |
|---|
| | | color: inherit; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class="p-main flex-c"> |
|---|
| | | <panel class="panel p-content"> |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">网关类别</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select v-model="gatewayType" clearable filterable class="dark" size="mini" @change="getList" placeholder="请选择"> |
|---|
| | | <el-option v-for="(item, idx) in gatewayTypes" :key="'type_' + idx" :label="item" :value="item"> |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">通信类别</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select v-model="commType" clearable filterable class="dark" size="mini" @change="getList" placeholder="请选择"> |
|---|
| | | <el-option v-for="(item, idx) in commTypes" :key="'level_' + idx" :label="item" :value="item"> |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <!-- <div class="s-item"> |
|---|
| | | <div class="label">连接状态</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select v-model="almLevel" class="dark" size="mini" @change="getList" placeholder="请选择"> |
|---|
| | | <el-option v-for="(item, idx) in almLevels" :key="'level_' + idx" :label="item" :value="idx"> |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | <div class="s-item"> |
|---|
| | | <gradient-btn size="sm" @click="getList">查询</gradient-btn> |
|---|
| | | <gradient-btn size="sm" @click="add">添加</gradient-btn> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="table-wrap"> |
|---|
| | | <el-table id="batteryrTimequeryTable" stripe size="small" :data="table.datas" height="100%" class="table-dark" |
|---|
| | | tooltip-effect="light"> |
|---|
| | | <el-table-column label="序号" type="index" width="80"></el-table-column> |
|---|
| | | <el-table-column v-for="header in table.headers" :key="header.prop" :prop="header.prop" :label="header.label" |
|---|
| | | :width="header.width" :min-width="header.minWidth" show-overflow-tooltip align="center"></el-table-column> |
|---|
| | | <el-table-column prop="cztime" fixed="right" width="240px" align="center" label="操作"> |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-button class="yellow" size="mini" @click="edit(scope.row)">编辑</el-button> |
|---|
| | | <el-button class="l-green" size="mini" @click="deleteRec(scope.row)">删除</el-button> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
| | | </div> |
|---|
| | | <!-- 底部分页 --> |
|---|
| | | <el-pagination class="pages center dark" :current-page="pageNum" @size-change="handleSizeChange" |
|---|
| | | @current-change="handleCurrentChange" :page-sizes="[10, 20, 30, 50, 100]" :page-size="pageSize" |
|---|
| | | layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination> |
|---|
| | | </div> |
|---|
| | | </panel> |
|---|
| | | <!-- 弹窗 --> |
|---|
| | | <el-dialog :title="editFlag ? '编辑网关' : '新增网关'" :visible.sync="addEditVisible" top="100px" |
|---|
| | | :close-on-click-modal="false" class="dialog-center" width="600px" center> |
|---|
| | | <add-edit v-if="addEditVisible" @success="addOk" :info="info" @cancel="onCanel"></add-edit> |
|---|
| | | </el-dialog> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import Panel from "@/components/panel.vue"; |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | import AddEdit from './addEdit'; |
|---|
| | | |
|---|
| | | |
|---|
| | | import { getGatewayList, getGatewayType, getCommType, deleteGateway } from "./js/apis"; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | components: { |
|---|
| | | Panel, |
|---|
| | | gradientBtn, |
|---|
| | | AddEdit, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | editFlag: false, |
|---|
| | | addEditVisible: false, |
|---|
| | | info: {}, |
|---|
| | | gatewayTypes: [], |
|---|
| | | commTypes: [], |
|---|
| | | pageNum: 1, |
|---|
| | | pageSize: 10, |
|---|
| | | commType: '', |
|---|
| | | gatewayType: '', |
|---|
| | | total: 0, |
|---|
| | | table: { |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "gatewayType", |
|---|
| | | label: "网关类别", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "gatewayName", |
|---|
| | | label: "网关名称", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "commType", |
|---|
| | | label: "通信类型", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | | label: "通信状态", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "ipAddr", |
|---|
| | | label: "IP地址", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "joinCount", |
|---|
| | | label: "接入设备数量", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | datas: [ |
|---|
| | | ], |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | deleteRec(record) { |
|---|
| | | this.$confirm("确认删除该记录吗", "系统提示", { |
|---|
| | | type: "warning", |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | deleteGateway(record.num).then((res) => { |
|---|
| | | let { code, data, msg } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | this.$message.success(msg); |
|---|
| | | this.getList(); |
|---|
| | | } else { |
|---|
| | | this.$message.error(msg); |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | .catch(() => { }); |
|---|
| | | }, |
|---|
| | | add() { |
|---|
| | | this.editFlag = false; |
|---|
| | | this.info = undefined; |
|---|
| | | this.addEditVisible = true; |
|---|
| | | }, |
|---|
| | | edit(record) { |
|---|
| | | this.editFlag = true; |
|---|
| | | this.info = record; |
|---|
| | | this.addEditVisible = true; |
|---|
| | | }, |
|---|
| | | addOk() { |
|---|
| | | // addGateway().then |
|---|
| | | this.addEditVisible = false; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | onCanel() { |
|---|
| | | this.addEditVisible = false; |
|---|
| | | }, |
|---|
| | | getGatewayType() { |
|---|
| | | getGatewayType().then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.gatewayTypes = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | getCommType() { |
|---|
| | | getCommType().then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.commTypes = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | getList() { |
|---|
| | | let params = { |
|---|
| | | pageCurr: this.pageNum, |
|---|
| | | pageSize: this.pageSize, |
|---|
| | | commType: this.commType || undefined, |
|---|
| | | gatewayType: this.gatewayType || undefined, |
|---|
| | | }; |
|---|
| | | console.log("=====9=", params, JSON.stringify(params)); |
|---|
| | | // this.SOCKET1.send(JSON.stringify(params)); |
|---|
| | | getGatewayList(params) |
|---|
| | | .then((res) => { |
|---|
| | | let { |
|---|
| | | code, |
|---|
| | | data, |
|---|
| | | data2: { list, total }, |
|---|
| | | } = res.data; |
|---|
| | | let list1 = []; |
|---|
| | | let total1 = 0; |
|---|
| | | if (code && data) { |
|---|
| | | list1 = list.map((v) => { |
|---|
| | | return v; |
|---|
| | | }); |
|---|
| | | total1 = total; |
|---|
| | | } |
|---|
| | | this.table.datas = list1; |
|---|
| | | this.total = total1; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | confirmAlarm(row) { |
|---|
| | | confirmAlarm(row.almId) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | console.log(data); |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | // 展示数据数量 |
|---|
| | | handleSizeChange(val) { |
|---|
| | | this.pageSize = val; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | // 翻页 |
|---|
| | | handleCurrentChange(val) { |
|---|
| | | this.pageNum = val; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() { |
|---|
| | | this.getList(); |
|---|
| | | this.getGatewayType(); |
|---|
| | | this.getCommType(); |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .p-main { |
|---|
| | | height: 100%; |
|---|
| | | |
|---|
| | | .btn-grp { |
|---|
| | | .btn-alarm { |
|---|
| | | width: 160px; |
|---|
| | | height: 30px; |
|---|
| | | color: #fff; |
|---|
| | | font-size: 18px; |
|---|
| | | font-weight: bold; |
|---|
| | | padding: 0 6px; |
|---|
| | | border: 0 none; |
|---|
| | | |
|---|
| | | /deep/ span { |
|---|
| | | display: flex; |
|---|
| | | color: inherit; |
|---|
| | | justify-content: space-between; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | background: #fff; |
|---|
| | | border-radius: 4px; |
|---|
| | | padding: 2px 16px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.levelall { |
|---|
| | | background: #78eef8; |
|---|
| | | |
|---|
| | | color: #011f39; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | background: #011f39; |
|---|
| | | color: #78eef8; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level0 { |
|---|
| | | background: #ff3801; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #ff3801; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level1 { |
|---|
| | | background: #f69f40; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #f69f40; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level2 { |
|---|
| | | background: #4871e3; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #4871e3; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.type { |
|---|
| | | background: #4871e3; |
|---|
| | | width: auto; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | margin-left: 1em; |
|---|
| | | color: #4871e3; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .p-content { |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 4px; |
|---|
| | | |
|---|
| | | /deep/ .content { |
|---|
| | | background: #011f39; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .panel-content { |
|---|
| | | height: 100%; |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .search { |
|---|
| | | padding: 0 0.4em; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | |
|---|
| | | .s-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .label { |
|---|
| | | color: #78eef8; |
|---|
| | | |
|---|
| | | &::after { |
|---|
| | | content: ":"; |
|---|
| | | } |
|---|
| | | |
|---|
| | | margin-right: 0.4em; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .table-wrap { |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 6px; |
|---|
| | | margin-bottom: 6px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/ .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { |
|---|
| | | background-color: #2155ff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | import axios from "axios"; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 查询 分页 获取断路器开关 |
|---|
| | | */ |
|---|
| | | export const getList = (params) => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "breakerInf/getBreakerInf", |
|---|
| | | params, |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 查询 分页 获取网关配置 |
|---|
| | | */ |
|---|
| | | export const getGatewayList = (params) => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "gatewayInf/getGatewayInf", |
|---|
| | | params, |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 获取网关类别 |
|---|
| | | */ |
|---|
| | | export const getGatewayType = () => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "gatewayInf/getGatewayType", |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 获取通讯类别 |
|---|
| | | */ |
|---|
| | | export const getCommType = () => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "gatewayInf/getCommType", |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | /** |
|---|
| | | * 增加网关 |
|---|
| | | */ |
|---|
| | | export const addGateway = (data) => { |
|---|
| | | return axios({ |
|---|
| | | method: "POST", |
|---|
| | | url: "gatewayInf/addGateway", |
|---|
| | | data, |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | /** |
|---|
| | | * 编辑网关 |
|---|
| | | */ |
|---|
| | | export const updateGateway = (data) => { |
|---|
| | | return axios({ |
|---|
| | | method: "POST", |
|---|
| | | url: "gatewayInf/updateGateway", |
|---|
| | | data, |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | /** |
|---|
| | | * 删除网关 |
|---|
| | | */ |
|---|
| | | export const deleteGateway = (num) => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "gatewayInf/deleteGateway", |
|---|
| | | params: { num }, |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | /** |
|---|
| | | * 断路器 获取安装位置 |
|---|
| | | */ |
|---|
| | | export const getBreakerAddr = () => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "breakerInf/getBreakerAddr", |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 断路器 获取断路器类别 下接 |
|---|
| | | */ |
|---|
| | | export const getBreakerType = () => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "breakerInf/getBreakerType", |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | /** |
|---|
| | | * 断路器 获取所属网关 |
|---|
| | | */ |
|---|
| | | export const getGatewayName = () => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "gatewayInf/getGatewayName", |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 断路器 获取断路器名称 下拉 |
|---|
| | | */ |
|---|
| | | export const getBreakerName = () => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "breakerInf/getBreakerName", |
|---|
| | | }); |
|---|
| | | }; |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class="p-main flex-c"> |
|---|
| | | <panel class="panel p-content"> |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">断路器类别</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="breakerType" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="sendMessage1" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in breakerTypeList" |
|---|
| | | :key="'type_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="item" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">安装位置</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="breakerAddr" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="sendMessage1" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in breakerAddrList" |
|---|
| | | :key="'level_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="item" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">所属网关</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="gatewayName" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="sendMessage1" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in gatewayNameList" |
|---|
| | | :key="'level_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="item" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <!-- <div class="s-item"> |
|---|
| | | <gradient-btn size="sm" @click="getList">查询</gradient-btn> |
|---|
| | | <gradient-btn size="sm" @click="getList">添加新开关</gradient-btn> |
|---|
| | | </div> --> |
|---|
| | | </div> |
|---|
| | | <div class="table-wrap"> |
|---|
| | | <el-table |
|---|
| | | id="batteryrTimequeryTable" |
|---|
| | | stripe |
|---|
| | | size="small" |
|---|
| | | :data="table.datas" |
|---|
| | | height="100%" |
|---|
| | | class="table-dark" |
|---|
| | | tooltip-effect="light" |
|---|
| | | > |
|---|
| | | <el-table-column |
|---|
| | | label="序号" |
|---|
| | | type="index" |
|---|
| | | width="80" |
|---|
| | | ></el-table-column> |
|---|
| | | <el-table-column |
|---|
| | | v-for="header in table.headers" |
|---|
| | | :key="header.prop" |
|---|
| | | :prop="header.prop" |
|---|
| | | :label="header.label" |
|---|
| | | :width="header.width" |
|---|
| | | :min-width="header.minWidth" |
|---|
| | | show-overflow-tooltip |
|---|
| | | align="center" |
|---|
| | | ></el-table-column> |
|---|
| | | <!-- <el-table-column prop="cztime" fixed="right" width="240px" align="center" label="操作"> |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-button class="yellow" size="mini" @click="details(scope.row)">编辑</el-button> |
|---|
| | | <el-button class="l-green" disabled="" size="mini">删除</el-button> |
|---|
| | | </template> |
|---|
| | | </el-table-column> --> |
|---|
| | | </el-table> |
|---|
| | | </div> |
|---|
| | | <!-- 底部分页 --> |
|---|
| | | <el-pagination |
|---|
| | | class="pages center dark" |
|---|
| | | :current-page="pageNum" |
|---|
| | | @size-change="handleSizeChange" |
|---|
| | | @current-change="handleCurrentChange" |
|---|
| | | :page-sizes="[10, 20, 30, 50, 100]" |
|---|
| | | :page-size="pageSize" |
|---|
| | | layout="total, sizes, prev, pager, next, jumper" |
|---|
| | | :total="total" |
|---|
| | | ></el-pagination> |
|---|
| | | </div> |
|---|
| | | </panel> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import Panel from "@/components/panel.vue"; |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | import getBinaryDigits from "@/assets/js/getBinaryDigits"; |
|---|
| | | |
|---|
| | | import createWs from "@/assets/js/websocket/plus"; |
|---|
| | | const WSMixin = createWs("breakerInfAndRt"); |
|---|
| | | |
|---|
| | | import { |
|---|
| | | getList, |
|---|
| | | getBreakerAddr, |
|---|
| | | getBreakerType, |
|---|
| | | getGatewayName, |
|---|
| | | } from "./js/apis"; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | mixins: [WSMixin], |
|---|
| | | components: { |
|---|
| | | Panel, |
|---|
| | | gradientBtn, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | switchStates: { |
|---|
| | | acin1_switch_trip: [], |
|---|
| | | acin2_switch_trip: [], |
|---|
| | | ac1_outswitch1_trip: [], |
|---|
| | | ac2_outswitch1_trip: [], |
|---|
| | | dcin1_switch_trip: [], |
|---|
| | | dcin2_switch_trip: [], |
|---|
| | | dc1_switch1_trip: [], |
|---|
| | | dc2_switch1_trip: [], |
|---|
| | | }, |
|---|
| | | breakerAddrList: [], |
|---|
| | | breakerTypeList: [], |
|---|
| | | gatewayNameList: [], |
|---|
| | | timeOut: false, |
|---|
| | | almCount: {}, |
|---|
| | | pageNum: 1, |
|---|
| | | pageSize: 10, |
|---|
| | | breakerAddr: "", |
|---|
| | | breakerType: "", |
|---|
| | | gatewayName: "", |
|---|
| | | total: 0, |
|---|
| | | table: { |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "breakerType", |
|---|
| | | label: "断路器类别", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "breakerName", |
|---|
| | | label: "开关名称", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "breakerAddr", |
|---|
| | | label: "安装位置", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "gatewayName", |
|---|
| | | label: "所在网关", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "liveStr", |
|---|
| | | label: "通信状态", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "state", |
|---|
| | | label: "断路器状态", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | datas: [], |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | onWSOpen1() { |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.sendMessage1(); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | sendMessage1() { |
|---|
| | | if (!this.isWSOpen1) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | let params = { |
|---|
| | | pageCurr: this.pageNum, |
|---|
| | | pageSize: this.pageSize, |
|---|
| | | breakerAddr: this.breakerAddr || undefined, |
|---|
| | | breakerType: this.breakerType || undefined, |
|---|
| | | gatewayName: this.gatewayName || undefined, |
|---|
| | | }; |
|---|
| | | console.log("=====9=", params, JSON.stringify(params)); |
|---|
| | | // console.log(this.actName, '.....'); |
|---|
| | | this.SOCKET1.send(JSON.stringify(params)); |
|---|
| | | }, |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { data, data2, data3 } = JSON.parse(res.data); |
|---|
| | | // console.log(data, "=====data", data2); |
|---|
| | | let time = new Date(data2.recordTime).getTime(); |
|---|
| | | let stamp = new Date(data3).getTime(); |
|---|
| | | if (Math.abs(time - stamp) > 2 * 60 * 1000) { |
|---|
| | | this.timeOut = true; |
|---|
| | | } else { |
|---|
| | | this.timeOut = false; |
|---|
| | | } |
|---|
| | | |
|---|
| | | let { |
|---|
| | | acIn1SwitchTripReal, |
|---|
| | | acIn2SwitchTripReal, |
|---|
| | | ac1OutSwitch1TripReal, |
|---|
| | | ac2OutSwitch1TripReal, |
|---|
| | | dcIn1SwitchTripReal, |
|---|
| | | dcIn2SwitchTripReal, |
|---|
| | | dc1Switch1TripReal, |
|---|
| | | dc2Switch1TripReal, |
|---|
| | | } = data2; |
|---|
| | | |
|---|
| | | let ac1_outswitch1_trip = getBinaryDigits(ac1OutSwitch1TripReal); |
|---|
| | | let ac2_outswitch1_trip = getBinaryDigits(ac2OutSwitch1TripReal); |
|---|
| | | let dc1_switch1_trip = getBinaryDigits(dc1Switch1TripReal); |
|---|
| | | let dc2_switch1_trip = getBinaryDigits(dc2Switch1TripReal); |
|---|
| | | let acin1_switch_trip = [acIn1SwitchTripReal]; |
|---|
| | | let acin2_switch_trip = [acIn2SwitchTripReal]; |
|---|
| | | let dcin1_switch_trip = [dcIn1SwitchTripReal]; |
|---|
| | | let dcin2_switch_trip = [dcIn2SwitchTripReal]; |
|---|
| | | |
|---|
| | | this.switchStates = { |
|---|
| | | acin1_switch_trip, |
|---|
| | | acin2_switch_trip, |
|---|
| | | ac1_outswitch1_trip, |
|---|
| | | ac2_outswitch1_trip, |
|---|
| | | dcin1_switch_trip, |
|---|
| | | dcin2_switch_trip, |
|---|
| | | dc1_switch1_trip, |
|---|
| | | dc2_switch1_trip, |
|---|
| | | }; |
|---|
| | | |
|---|
| | | this.getList(data); |
|---|
| | | }, |
|---|
| | | getList(res) { |
|---|
| | | if (res) { |
|---|
| | | let { list, total } = res; |
|---|
| | | let list1 = []; |
|---|
| | | let total1 = 0; |
|---|
| | | list1 = list.map((v) => { |
|---|
| | | v.liveStr = this.timeOut ? "离线" : "在线"; |
|---|
| | | // 断路器状态 |
|---|
| | | v.state = this.switchStates[v.nodeName][v.nodeBit] ? "合闸" : "分闸"; |
|---|
| | | return v; |
|---|
| | | }); |
|---|
| | | total1 = total; |
|---|
| | | this.table.datas = list1; |
|---|
| | | this.total = total1; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | confirmAlarm(row) { |
|---|
| | | confirmAlarm(row.almId) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | console.log(data); |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | // 展示数据数量 |
|---|
| | | handleSizeChange(val) { |
|---|
| | | this.pageSize = val; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | // 翻页 |
|---|
| | | handleCurrentChange(val) { |
|---|
| | | this.pageNum = val; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | getBreakerAddr() { |
|---|
| | | getBreakerAddr() |
|---|
| | | .then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.breakerAddrList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getBreakerType() { |
|---|
| | | getBreakerType() |
|---|
| | | .then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.breakerTypeList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getGatewayName() { |
|---|
| | | getGatewayName() |
|---|
| | | .then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.gatewayNameList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() { |
|---|
| | | this.sendMessage1(); |
|---|
| | | this.getBreakerAddr(); |
|---|
| | | this.getBreakerType(); |
|---|
| | | this.getGatewayName(); |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .p-main { |
|---|
| | | height: 100%; |
|---|
| | | |
|---|
| | | .btn-grp { |
|---|
| | | .btn-alarm { |
|---|
| | | width: 160px; |
|---|
| | | height: 30px; |
|---|
| | | color: #fff; |
|---|
| | | font-size: 18px; |
|---|
| | | font-weight: bold; |
|---|
| | | padding: 0 6px; |
|---|
| | | border: 0 none; |
|---|
| | | |
|---|
| | | /deep/ span { |
|---|
| | | display: flex; |
|---|
| | | color: inherit; |
|---|
| | | justify-content: space-between; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | background: #fff; |
|---|
| | | border-radius: 4px; |
|---|
| | | padding: 2px 16px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.levelall { |
|---|
| | | background: #78eef8; |
|---|
| | | |
|---|
| | | color: #011f39; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | background: #011f39; |
|---|
| | | color: #78eef8; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level0 { |
|---|
| | | background: #ff3801; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #ff3801; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level1 { |
|---|
| | | background: #f69f40; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #f69f40; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level2 { |
|---|
| | | background: #4871e3; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #4871e3; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.type { |
|---|
| | | background: #4871e3; |
|---|
| | | width: auto; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | margin-left: 1em; |
|---|
| | | color: #4871e3; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .p-content { |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 4px; |
|---|
| | | |
|---|
| | | /deep/ .content { |
|---|
| | | background: #011f39; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .panel-content { |
|---|
| | | height: 100%; |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .search { |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | padding: 0 0.4em; |
|---|
| | | |
|---|
| | | .s-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .label { |
|---|
| | | color: #78eef8; |
|---|
| | | |
|---|
| | | &::after { |
|---|
| | | content: ":"; |
|---|
| | | } |
|---|
| | | |
|---|
| | | margin-right: 0.4em; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .table-wrap { |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 6px; |
|---|
| | | margin-bottom: 6px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/ .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { |
|---|
| | | background-color: #2155ff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
copy from src/views/testRecord/index.vue
copy to src/views/devRtalarm/index.vue
| File was copied from src/views/testRecord/index.vue |
| | |
|---|
| | | <template> |
|---|
| | | <div class="p-main flex-c"> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <el-button class="btn-alarm levelall" @click="changeLevel(0)" |
|---|
| | | >全部告警 |
|---|
| | | <div class="num">{{ almCount[0] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level0" @click="changeLevel(3)"> |
|---|
| | | <div class="a">紧急</div> |
|---|
| | | |
|---|
| | | <div class="num">{{ almCount[3] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level1" @click="changeLevel(2)" |
|---|
| | | >重大 |
|---|
| | | |
|---|
| | | <div class="num">{{ almCount[2] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level2" @click="changeLevel(1)" |
|---|
| | | >一般 |
|---|
| | | |
|---|
| | | <div class="num">{{ almCount[1] }}</div> |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | <panel class="panel p-content"> |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测控线路</div> |
|---|
| | | <div class="label">告警名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="devType" |
|---|
| | | v-model="almName" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | filterable |
|---|
| | | @change="sendMessage1" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in devtypes" |
|---|
| | | :key="'type_' + idx" |
|---|
| | | v-for="(item, idx) in almNames" |
|---|
| | | :key="'name_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="idx" |
|---|
| | | > |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">断路器名称</div> |
|---|
| | | <div class="label">告警等级</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="almLevel" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | @change="sendMessage1" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测控日期</div> |
|---|
| | | <!-- <div class="s-item"> |
|---|
| | | <div class="label">告警开始时间</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-date-picker |
|---|
| | | v-model="date1" |
|---|
| | | v-model="valueTime1" |
|---|
| | | size="mini" |
|---|
| | | class="time_box dark" |
|---|
| | | type="date" |
|---|
| | | placeholder="选择日期" |
|---|
| | | @change="getList" |
|---|
| | | value-format="yyyy-MM-dd" |
|---|
| | | ></el-date-picker |
|---|
| | | >- |
|---|
| | | <el-date-picker |
|---|
| | | v-model="date2" |
|---|
| | | size="mini" |
|---|
| | | class="time_box dark" |
|---|
| | | type="date" |
|---|
| | | placeholder="选择日期" |
|---|
| | | @change="getList" |
|---|
| | | value-format="yyyy-MM-dd" |
|---|
| | | ></el-date-picker> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <gradient-btn size="sm" @click="getList">查询</gradient-btn> |
|---|
| | | <div class="label">告警确认时间</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-date-picker |
|---|
| | | v-model="valueTime1" |
|---|
| | | size="mini" |
|---|
| | | class="time_box dark" |
|---|
| | | type="date" |
|---|
| | | placeholder="选择日期" |
|---|
| | | value-format="yyyy-MM-dd" |
|---|
| | | ></el-date-picker> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <gradient-btn size="sm">查询</gradient-btn> |
|---|
| | | </div> --> |
|---|
| | | </div> |
|---|
| | | <div class="table-wrap"> |
|---|
| | | <el-table |
|---|
| | |
|---|
| | | show-overflow-tooltip |
|---|
| | | align="center" |
|---|
| | | ></el-table-column> |
|---|
| | | <el-table-column label="确认告警" width="120" align="center"> |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-checkbox |
|---|
| | | :value="!!scope.row.almIsConfirmed" |
|---|
| | | disabled |
|---|
| | | ></el-checkbox> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | <el-table-column |
|---|
| | | prop="cztime" |
|---|
| | | fixed="right" |
|---|
| | |
|---|
| | | <el-button |
|---|
| | | class="yellow" |
|---|
| | | size="mini" |
|---|
| | | @click="details(scope.row)" |
|---|
| | | >详情</el-button |
|---|
| | | @click="confirmAlarm(scope.row)" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | >确认告警</el-button |
|---|
| | | > |
|---|
| | | <!-- <el-button class="l-green" disabled="" size="mini" |
|---|
| | | >告警详情</el-button |
|---|
| | |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | |
|---|
| | | import createWs from "@/assets/js/websocket/plus"; |
|---|
| | | const WSMixin = createWs("ckPowerDevAlarmHisCount"); |
|---|
| | | const WSMixin = createWs("ckPowerDevAlarm", "ckPowerDevAlarmCount"); |
|---|
| | | |
|---|
| | | import { getList } from "./js/apis"; |
|---|
| | | import { confirmAlarm } from "./js/apis"; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | |
|---|
| | |
|---|
| | | Panel, |
|---|
| | | gradientBtn, |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | hasPermission() { |
|---|
| | | return this.$store.state.user.downloadFlag == 1; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | almCount: {}, |
|---|
| | | pageNum: 1, |
|---|
| | | pageSize: 10, |
|---|
| | | devType: 0, |
|---|
| | | almName: "", |
|---|
| | | almLevel: 0, |
|---|
| | | date1: "", |
|---|
| | | date2: "", |
|---|
| | | valueTime1: "", |
|---|
| | | devtypes: ["全部", "交流配电柜", "直流配电柜", "高频开关电源柜"], |
|---|
| | | almLevels: ["全部", "一般", "重大", "紧急"], |
|---|
| | | almNames: [ |
|---|
| | | |
|---|
| | | ], |
|---|
| | | total: 0, |
|---|
| | | table: { |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "devName", |
|---|
| | | label: "断路器位置", |
|---|
| | | label: "设备名称", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almName", |
|---|
| | | label: "断路器名称", |
|---|
| | | label: "告警名称", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | | label: "测控日期", |
|---|
| | | label: "告警等级", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almStartTime", |
|---|
| | | label: "动作总次数", |
|---|
| | | label: "告警开始时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almConfirmedTime", |
|---|
| | | label: "合闸次数", |
|---|
| | | label: "告警确认时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almIsConfirmed", |
|---|
| | | label: "分闸次数", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // prop: "almIsConfirmed", |
|---|
| | | // label: "确认告警", |
|---|
| | | // width: 120, |
|---|
| | | // }, |
|---|
| | | ], |
|---|
| | | datas: [ |
|---|
| | | { |
|---|
| | | devName: 1, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | datas: [], |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | details() { |
|---|
| | | this.$router.push("/test-record/details"); |
|---|
| | | changeLevel(level) { |
|---|
| | | this.almLevel = level; |
|---|
| | | this.sendMessage1(); |
|---|
| | | }, |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { |
|---|
| | |
|---|
| | | }); |
|---|
| | | this.total = total; |
|---|
| | | }, |
|---|
| | | onWSMessage1(res) { |
|---|
| | | onWSMessage2(res) { |
|---|
| | | let { data } = JSON.parse(res.data); |
|---|
| | | this.almCount = data; |
|---|
| | | }, |
|---|
| | | getList() { |
|---|
| | | onWSOpen1() { |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.sendMessage1(); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | sendMessage1() { |
|---|
| | | if (!this.isWSOpen1) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | let params = { |
|---|
| | | pageNum: this.pageNum, |
|---|
| | | pageSize: this.pageSize, |
|---|
| | | devType: this.devType, |
|---|
| | | almStartTime: this.date1 |
|---|
| | | ? this.date1 + " 00:00:00" |
|---|
| | | : "2023-01-01 00:00:00", |
|---|
| | | almStartTime1: this.date2 |
|---|
| | | ? this.date2 + " 23:59:59" |
|---|
| | | : new Date().format("yyyy-MM-dd hh:mm:ss"), |
|---|
| | | almName: this.almName, |
|---|
| | | almLevel: this.almLevel, |
|---|
| | | }; |
|---|
| | | console.log("=====9=", params, JSON.stringify(params)); |
|---|
| | | // this.SOCKET1.send(JSON.stringify(params)); |
|---|
| | | getList(params) |
|---|
| | | .then((res) => { |
|---|
| | | let { |
|---|
| | | code, |
|---|
| | | data: { list, total }, |
|---|
| | | } = res.data; |
|---|
| | | let list1 = []; |
|---|
| | | let total1 = 0; |
|---|
| | | if (code) { |
|---|
| | | list1 = list.map((v) => { |
|---|
| | | v.devName = ["", "交流配电柜", "直流配电柜", "高频开关电源柜"][ |
|---|
| | | v.devType |
|---|
| | | ]; |
|---|
| | | v.almLevelStr = ["", "一般", "重大", "紧急"][v.almLevel]; |
|---|
| | | return v; |
|---|
| | | }); |
|---|
| | | total1 = total; |
|---|
| | | } |
|---|
| | | this.table.datas = list1; |
|---|
| | | this.total = total1; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | //console.log("=====9=", params, JSON.stringify(params)); |
|---|
| | | this.SOCKET1.send(JSON.stringify(params)); |
|---|
| | | }, |
|---|
| | | confirmAlarm(row) { |
|---|
| | | confirmAlarm(row.almId) |
|---|
| | |
|---|
| | | // 展示数据数量 |
|---|
| | | handleSizeChange(val) { |
|---|
| | | this.pageSize = val; |
|---|
| | | this.getList(); |
|---|
| | | this.sendMessage1(); |
|---|
| | | }, |
|---|
| | | // 翻页 |
|---|
| | | handleCurrentChange(val) { |
|---|
| | | this.pageNum = val; |
|---|
| | | this.getList(); |
|---|
| | | this.sendMessage1(); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | |
|---|
| | | &.level2 { |
|---|
| | | background: #4871e3; |
|---|
| | | .num { |
|---|
| | | color: #4871e3; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.type { |
|---|
| | | background: #4871e3; |
|---|
| | | width: auto; |
|---|
| | | .num { |
|---|
| | | margin-left: 1em; |
|---|
| | | color: #4871e3; |
|---|
| | | } |
|---|
| | | } |
|---|
| New file |
| | |
|---|
| | | import axios from "axios"; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 确认告警 |
|---|
| | | */ |
|---|
| | | export const confirmAlarm = (id) => { |
|---|
| | | return axios({ |
|---|
| | | method: "POST", |
|---|
| | | url: "ckPowerDevAlarm/updateForConfirm", |
|---|
| | | params: { id }, |
|---|
| | | }); |
|---|
| | | }; |
|---|
copy from src/views/testRecord/index.vue
copy to src/views/disjunctorHisalarm/index.vue
| File was copied from src/views/testRecord/index.vue |
| | |
|---|
| | | <template> |
|---|
| | | <div class="p-main flex-c"> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <el-button class="btn-alarm levelall" |
|---|
| | | >全部告警 |
|---|
| | | <div class="num">{{ almCount[0] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level0" |
|---|
| | | >紧急 |
|---|
| | | <div class="num">{{ almCount[3] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level1" |
|---|
| | | >重大 |
|---|
| | | <div class="num">{{ almCount[2] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level2" |
|---|
| | | >一般 |
|---|
| | | <div class="num">{{ almCount[1] }}</div> |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | <panel class="panel p-content"> |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测控线路</div> |
|---|
| | | <div class="label">断路器类型</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="devType" |
|---|
| | | v-model="breakerType" |
|---|
| | | filterable |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in devtypes" |
|---|
| | | v-for="(item, idx) in breakerTypeList" |
|---|
| | | :key="'type_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="idx" |
|---|
| | | :value="item" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | |
|---|
| | | <div class="label">断路器名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="almLevel" |
|---|
| | | v-model="breakerName" |
|---|
| | | filterable |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in almLevels" |
|---|
| | | :key="'level_' + idx" |
|---|
| | | v-for="(item, idx) in breakerNameList" |
|---|
| | | :key="'type_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="idx" |
|---|
| | | :value="item" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测控日期</div> |
|---|
| | | <div class="label">告警名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="almName" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | filterable |
|---|
| | | @change="getList" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in almNameList" |
|---|
| | | :key="'name_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="item" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">告警开始时间</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-date-picker |
|---|
| | | v-model="date1" |
|---|
| | | v-model="almStarttime" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | class="time_box dark" |
|---|
| | | type="date" |
|---|
| | | placeholder="选择日期" |
|---|
| | | @change="getList" |
|---|
| | | value-format="yyyy-MM-dd" |
|---|
| | | ></el-date-picker |
|---|
| | | >- |
|---|
| | | ></el-date-picker> |
|---|
| | | - |
|---|
| | | <el-date-picker |
|---|
| | | v-model="date2" |
|---|
| | | v-model="almStarttime1" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | class="time_box dark" |
|---|
| | | type="date" |
|---|
| | | placeholder="选择日期" |
|---|
| | | @change="getList" |
|---|
| | | value-format="yyyy-MM-dd" |
|---|
| | | ></el-date-picker> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | show-overflow-tooltip |
|---|
| | | align="center" |
|---|
| | | ></el-table-column> |
|---|
| | | <el-table-column |
|---|
| | | prop="cztime" |
|---|
| | | fixed="right" |
|---|
| | | width="240px" |
|---|
| | | align="center" |
|---|
| | | label="操作" |
|---|
| | | > |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-button |
|---|
| | | class="yellow" |
|---|
| | | size="mini" |
|---|
| | | @click="details(scope.row)" |
|---|
| | | >详情</el-button |
|---|
| | | > |
|---|
| | | <!-- <el-button class="l-green" disabled="" size="mini" |
|---|
| | | >告警详情</el-button |
|---|
| | | > --> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
| | | </div> |
|---|
| | | <!-- 底部分页 --> |
|---|
| | |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | |
|---|
| | | import createWs from "@/assets/js/websocket/plus"; |
|---|
| | | const WSMixin = createWs("ckPowerDevAlarmHisCount"); |
|---|
| | | const WSMixin = createWs("ckPowerDevBreakAlarmHisCount"); |
|---|
| | | |
|---|
| | | import { getList } from "./js/apis"; |
|---|
| | | import { getBreakerName, getBreakerType } from "../devManager/js/apis"; |
|---|
| | | import { getAlmName } from "../disjunctorSettings/js/apis"; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | |
|---|
| | |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | breakerNameList: [], |
|---|
| | | breakerTypeList: [], |
|---|
| | | almNameList: [], |
|---|
| | | almCount: {}, |
|---|
| | | pageNum: 1, |
|---|
| | | pageSize: 10, |
|---|
| | | devType: 0, |
|---|
| | | almLevel: 0, |
|---|
| | | date1: "", |
|---|
| | | date2: "", |
|---|
| | | devtypes: ["全部", "交流配电柜", "直流配电柜", "高频开关电源柜"], |
|---|
| | | almLevels: ["全部", "一般", "重大", "紧急"], |
|---|
| | | almName: "", |
|---|
| | | almStarttime: "", |
|---|
| | | almStarttime1: "", |
|---|
| | | breakerName: "", |
|---|
| | | breakerType: "", |
|---|
| | | total: 0, |
|---|
| | | table: { |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "devName", |
|---|
| | | prop: "breakerAddr", |
|---|
| | | label: "断路器位置", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almName", |
|---|
| | | label: "断路器名称", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | | label: "测控日期", |
|---|
| | | prop: "breakerType", |
|---|
| | | label: "断路器类型", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "breakerName", |
|---|
| | | label: "断路器名称", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almStartTime", |
|---|
| | | label: "动作总次数", |
|---|
| | | prop: "almName", |
|---|
| | | label: "告警名称", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almValue", |
|---|
| | | label: "告警值", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almStarttime", |
|---|
| | | label: "告警开始时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almConfirmedTime", |
|---|
| | | label: "合闸次数", |
|---|
| | | label: "告警确认时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almIsConfirmed", |
|---|
| | | label: "分闸次数", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // prop: "almIsConfirmed", |
|---|
| | | // label: "确认告警", |
|---|
| | | // width: 120, |
|---|
| | | // }, |
|---|
| | | ], |
|---|
| | | datas: [ |
|---|
| | | { |
|---|
| | | devName: 1, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | datas: [], |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | details() { |
|---|
| | | this.$router.push("/test-record/details"); |
|---|
| | | changeType(value) { |
|---|
| | | this.devType = value; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { |
|---|
| | |
|---|
| | | let params = { |
|---|
| | | pageNum: this.pageNum, |
|---|
| | | pageSize: this.pageSize, |
|---|
| | | devType: this.devType, |
|---|
| | | almStartTime: this.date1 |
|---|
| | | ? this.date1 + " 00:00:00" |
|---|
| | | : "2023-01-01 00:00:00", |
|---|
| | | almStartTime1: this.date2 |
|---|
| | | ? this.date2 + " 23:59:59" |
|---|
| | | breakerName: this.breakerName || undefined, |
|---|
| | | almName: this.almName || undefined, |
|---|
| | | breakerType: this.breakerType || undefined, |
|---|
| | | almStarttime: this.almStarttime |
|---|
| | | ? this.almStarttime + " 00:00:00" |
|---|
| | | : '2023-01-01 00:00:00', |
|---|
| | | almStarttime1: this.almStarttime1 |
|---|
| | | ? this.almStarttime1 + " 23:59:59" |
|---|
| | | : new Date().format("yyyy-MM-dd hh:mm:ss"), |
|---|
| | | almLevel: this.almLevel, |
|---|
| | | }; |
|---|
| | | console.log("=====9=", params, JSON.stringify(params)); |
|---|
| | | // this.SOCKET1.send(JSON.stringify(params)); |
|---|
| | |
|---|
| | | let total1 = 0; |
|---|
| | | if (code) { |
|---|
| | | list1 = list.map((v) => { |
|---|
| | | v.devName = ["", "交流配电柜", "直流配电柜", "高频开关电源柜"][ |
|---|
| | | v.devType |
|---|
| | | ]; |
|---|
| | | v.almLevelStr = ["", "一般", "重大", "紧急"][v.almLevel]; |
|---|
| | | // v.breakerTypeStr = ["", "交流微断路器", "直流微断路器"][v.breakerType]; |
|---|
| | | return v; |
|---|
| | | }); |
|---|
| | | total1 = total; |
|---|
| | |
|---|
| | | this.pageNum = val; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | getAlmName() { |
|---|
| | | getAlmName() |
|---|
| | | .then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.almNameList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getBreakerName() { |
|---|
| | | getBreakerName() |
|---|
| | | .then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.breakerNameList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getBreakerType() { |
|---|
| | | getBreakerType() |
|---|
| | | .then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.breakerTypeList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() {}, |
|---|
| | | mounted() { |
|---|
| | | this.getAlmName(); |
|---|
| | | this.getBreakerName(); |
|---|
| | | this.getBreakerType(); |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | |
|---|
| | | } |
|---|
| | | .search { |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-around; |
|---|
| | | justify-content: space-between; |
|---|
| | | padding: 0 0.4em; |
|---|
| | | .s-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | |
|---|
| | | background-color: #2155ff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | import axios from "axios"; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 查询 分页 |
|---|
| | | */ |
|---|
| | | export const getList = (data) => { |
|---|
| | | return axios({ |
|---|
| | | method: "POST", |
|---|
| | | url: "ckPowerDevBreakAlarmHistory/getPage", |
|---|
| | | data |
|---|
| | | }); |
|---|
| | | }; |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class="p-main flex-c"> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <el-button class="btn-alarm levelall" |
|---|
| | | >全部告警 |
|---|
| | | <div class="num">{{ almCount[0] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level0"> |
|---|
| | | <div class="a">紧急</div> |
|---|
| | | <div class="num">{{ almCount[3] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level1" |
|---|
| | | >重大 |
|---|
| | | <div class="num">{{ almCount[2] }}</div> |
|---|
| | | </el-button> |
|---|
| | | <el-button class="btn-alarm level2" |
|---|
| | | >一般 |
|---|
| | | <div class="num">{{ almCount[1] }}</div> |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | <panel class="panel p-content"> |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">断路器类型</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="breakerType" |
|---|
| | | filterable |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="sendMessage1" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in breakerTypeList" |
|---|
| | | :key="'type_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="item" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">断路器名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="breakerName" |
|---|
| | | filterable |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="sendMessage1" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in breakerNameList" |
|---|
| | | :key="'type_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="item" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">告警名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="almName" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | filterable |
|---|
| | | @change="sendMessage1" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in almNameList" |
|---|
| | | :key="'name_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="item" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">告警开始时间</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-date-picker |
|---|
| | | v-model="almStarttime" |
|---|
| | | size="mini" |
|---|
| | | @change="sendMessage1" |
|---|
| | | class="time_box dark" |
|---|
| | | type="date" |
|---|
| | | placeholder="选择日期" |
|---|
| | | value-format="yyyy-MM-dd" |
|---|
| | | ></el-date-picker> |
|---|
| | | - |
|---|
| | | <el-date-picker |
|---|
| | | v-model="almStarttime1" |
|---|
| | | size="mini" |
|---|
| | | @change="sendMessage1" |
|---|
| | | class="time_box dark" |
|---|
| | | type="date" |
|---|
| | | placeholder="选择日期" |
|---|
| | | value-format="yyyy-MM-dd" |
|---|
| | | ></el-date-picker> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <!-- |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">告警确认时间</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-date-picker |
|---|
| | | v-model="valueTime1" |
|---|
| | | size="mini" |
|---|
| | | class="time_box dark" |
|---|
| | | type="date" |
|---|
| | | placeholder="选择日期" |
|---|
| | | value-format="yyyy-MM-dd" |
|---|
| | | ></el-date-picker> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <gradient-btn size="sm">查询</gradient-btn> |
|---|
| | | </div> --> |
|---|
| | | </div> |
|---|
| | | <div class="table-wrap"> |
|---|
| | | <el-table |
|---|
| | | id="batteryrTimequeryTable" |
|---|
| | | stripe |
|---|
| | | size="small" |
|---|
| | | :data="table.datas" |
|---|
| | | height="100%" |
|---|
| | | class="table-dark" |
|---|
| | | tooltip-effect="light" |
|---|
| | | > |
|---|
| | | <el-table-column |
|---|
| | | label="序号" |
|---|
| | | type="index" |
|---|
| | | width="80" |
|---|
| | | ></el-table-column> |
|---|
| | | <el-table-column |
|---|
| | | v-for="header in table.headers" |
|---|
| | | :key="header.prop" |
|---|
| | | :prop="header.prop" |
|---|
| | | :label="header.label" |
|---|
| | | :width="header.width" |
|---|
| | | :min-width="header.minWidth" |
|---|
| | | show-overflow-tooltip |
|---|
| | | align="center" |
|---|
| | | ></el-table-column> |
|---|
| | | <el-table-column label="确认告警" width="120" align="center"> |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-checkbox |
|---|
| | | :value="!!scope.row.almIsConfirmed" |
|---|
| | | disabled |
|---|
| | | ></el-checkbox> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | <el-table-column |
|---|
| | | prop="cztime" |
|---|
| | | fixed="right" |
|---|
| | | width="240px" |
|---|
| | | align="center" |
|---|
| | | label="操作" |
|---|
| | | > |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-button |
|---|
| | | class="yellow" |
|---|
| | | size="mini" |
|---|
| | | @click="confirmAlarm(scope.row)" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | >确认告警</el-button |
|---|
| | | > |
|---|
| | | <!-- <el-button class="l-green" disabled="" size="mini" |
|---|
| | | >告警详情</el-button |
|---|
| | | > --> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
| | | </div> |
|---|
| | | <!-- 底部分页 --> |
|---|
| | | <el-pagination |
|---|
| | | class="pages center dark" |
|---|
| | | :current-page="pageNum" |
|---|
| | | @size-change="handleSizeChange" |
|---|
| | | @current-change="handleCurrentChange" |
|---|
| | | :page-sizes="[10, 20, 30, 50, 100]" |
|---|
| | | :page-size="pageSize" |
|---|
| | | layout="total, sizes, prev, pager, next, jumper" |
|---|
| | | :total="total" |
|---|
| | | ></el-pagination> |
|---|
| | | </div> |
|---|
| | | </panel> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import Panel from "@/components/panel.vue"; |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | |
|---|
| | | import createWs from "@/assets/js/websocket/plus"; |
|---|
| | | const WSMixin = createWs("ckPowerDevBreakAlarm", "ckPowerDevBreakAlarmCount"); |
|---|
| | | |
|---|
| | | import { confirmAlarm } from "./js/apis"; |
|---|
| | | import { getBreakerName, getBreakerType } from "../devManager/js/apis"; |
|---|
| | | import { getAlmName } from "../disjunctorSettings/js/apis"; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | |
|---|
| | | mixins: [WSMixin], |
|---|
| | | components: { |
|---|
| | | Panel, |
|---|
| | | gradientBtn, |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | hasPermission() { |
|---|
| | | return this.$store.state.user.downloadFlag == 1; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | breakerNameList: [], |
|---|
| | | breakerTypeList: [], |
|---|
| | | almNameList: [], |
|---|
| | | almCount: {}, |
|---|
| | | pageNum: 1, |
|---|
| | | pageSize: 10, |
|---|
| | | almName: "", |
|---|
| | | almStarttime: "", |
|---|
| | | almStarttime1: "", |
|---|
| | | breakerName: "", |
|---|
| | | breakerType: "", |
|---|
| | | total: 0, |
|---|
| | | table: { |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "breakerAddr", |
|---|
| | | label: "断路器位置", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "breakerType", |
|---|
| | | label: "断路器类型", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "breakerName", |
|---|
| | | label: "断路器名称", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almName", |
|---|
| | | label: "告警名称", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almValue", |
|---|
| | | label: "告警值", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almStarttime", |
|---|
| | | label: "告警开始时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almConfirmedTime", |
|---|
| | | label: "告警确认时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // prop: "almIsConfirmed", |
|---|
| | | // label: "确认告警", |
|---|
| | | // width: 120, |
|---|
| | | // }, |
|---|
| | | ], |
|---|
| | | datas: [], |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { |
|---|
| | | data: { list, total }, |
|---|
| | | } = JSON.parse(res.data); |
|---|
| | | this.table.datas = list; |
|---|
| | | this.total = total; |
|---|
| | | }, |
|---|
| | | onWSMessage2(res) { |
|---|
| | | let { data } = JSON.parse(res.data); |
|---|
| | | this.almCount = data; |
|---|
| | | }, |
|---|
| | | onWSOpen1() { |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.sendMessage1(); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | sendMessage1() { |
|---|
| | | if (!this.isWSOpen1) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | let params = { |
|---|
| | | pageNum: this.pageNum, |
|---|
| | | pageSize: this.pageSize, |
|---|
| | | breakerName: this.breakerName || undefined, |
|---|
| | | almName: this.almName || undefined, |
|---|
| | | breakerType: this.breakerType || undefined, |
|---|
| | | almStarttime: this.almStarttime |
|---|
| | | ? this.almStarttime + " 00:00:00" |
|---|
| | | : undefined, |
|---|
| | | almStarttime1: this.almStarttime1 |
|---|
| | | ? this.almStarttime1 + " 23:59:59" |
|---|
| | | : undefined, |
|---|
| | | }; |
|---|
| | | //console.log("=====9=", params, JSON.stringify(params)); |
|---|
| | | this.SOCKET1.send(JSON.stringify(params)); |
|---|
| | | }, |
|---|
| | | confirmAlarm(row) { |
|---|
| | | this.$confirm("确认告警提示", "系统提示", { |
|---|
| | | type: "warning", |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | confirmAlarm(row.almId) |
|---|
| | | .then((res) => { |
|---|
| | | let { code } = res.data; |
|---|
| | | if (code) { |
|---|
| | | this.$message.success("操作成功"); |
|---|
| | | this.sendMessage1(); |
|---|
| | | } else { |
|---|
| | | this.$message.success("操作失败"); |
|---|
| | | } |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | .catch(() => {}); |
|---|
| | | }, |
|---|
| | | // 展示数据数量 |
|---|
| | | handleSizeChange(val) { |
|---|
| | | this.pageSize = val; |
|---|
| | | this.sendMessage1(); |
|---|
| | | }, |
|---|
| | | // 翻页 |
|---|
| | | handleCurrentChange(val) { |
|---|
| | | this.pageNum = val; |
|---|
| | | this.sendMessage1(); |
|---|
| | | }, |
|---|
| | | getAlmName() { |
|---|
| | | getAlmName() |
|---|
| | | .then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.almNameList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getBreakerName() { |
|---|
| | | getBreakerName() |
|---|
| | | .then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.breakerNameList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getBreakerType() { |
|---|
| | | getBreakerType() |
|---|
| | | .then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.breakerTypeList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() { |
|---|
| | | this.getAlmName(); |
|---|
| | | this.getBreakerName(); |
|---|
| | | this.getBreakerType(); |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .p-main { |
|---|
| | | height: 100%; |
|---|
| | | |
|---|
| | | .btn-grp { |
|---|
| | | .btn-alarm { |
|---|
| | | width: 160px; |
|---|
| | | height: 30px; |
|---|
| | | color: #fff; |
|---|
| | | font-size: 18px; |
|---|
| | | font-weight: bold; |
|---|
| | | padding: 0 6px; |
|---|
| | | border: 0 none; |
|---|
| | | |
|---|
| | | /deep/ span { |
|---|
| | | display: flex; |
|---|
| | | color: inherit; |
|---|
| | | justify-content: space-between; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | background: #fff; |
|---|
| | | border-radius: 4px; |
|---|
| | | padding: 2px 16px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.levelall { |
|---|
| | | background: #78eef8; |
|---|
| | | |
|---|
| | | color: #011f39; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | background: #011f39; |
|---|
| | | color: #78eef8; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level0 { |
|---|
| | | background: #ff3801; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #ff3801; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level1 { |
|---|
| | | background: #f69f40; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #f69f40; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level2 { |
|---|
| | | background: #4871e3; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #4871e3; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .p-content { |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 4px; |
|---|
| | | |
|---|
| | | /deep/ .content { |
|---|
| | | background: #011f39; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .panel-content { |
|---|
| | | height: 100%; |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .search { |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-around; |
|---|
| | | |
|---|
| | | .s-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .label { |
|---|
| | | color: #78eef8; |
|---|
| | | |
|---|
| | | &::after { |
|---|
| | | content: ":"; |
|---|
| | | } |
|---|
| | | |
|---|
| | | margin-right: 0.4em; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .table-wrap { |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 6px; |
|---|
| | | margin-bottom: 6px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/ .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { |
|---|
| | | background-color: #2155ff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | import axios from "axios"; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 确认告警 |
|---|
| | | */ |
|---|
| | | export const confirmAlarm = (id) => { |
|---|
| | | return axios({ |
|---|
| | | method: "POST", |
|---|
| | | url: "ckPowerDevBreakAlarm/updateForConfirm", |
|---|
| | | params: { id }, |
|---|
| | | }); |
|---|
| | | }; |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class=""> |
|---|
| | | <el-form ref="form" :model="form" :rules="rules" label-width="80px"> |
|---|
| | | <el-form-item label="告警名称" prop="almName" required> |
|---|
| | | <el-input size="mini" v-model="form.almName"></el-input> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="预警值" prop="almEarly" required> |
|---|
| | | <el-input size="mini" v-model="form.almEarly"></el-input> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="告警值" prop="almValue" required> |
|---|
| | | <el-input size="mini" v-model="form.almValue"></el-input> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="是否启用" prop="commType"> |
|---|
| | | <el-checkbox v-model="form.almEn"></el-checkbox> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item> |
|---|
| | | <el-button type="primary" @click="update">修改</el-button> |
|---|
| | | <el-button @click="close">取消</el-button> |
|---|
| | | </el-form-item> |
|---|
| | | </el-form> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import { updateAlmConfig } from "./js/apis"; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | props: { |
|---|
| | | info: { |
|---|
| | | type: Object, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | rules: { |
|---|
| | | almName: [ |
|---|
| | | { required: true, message: '请输入告警名称', trigger: 'blur' }, |
|---|
| | | ], |
|---|
| | | almEarly: [ |
|---|
| | | { required: true, message: '请输入预警值', trigger: 'blur' } |
|---|
| | | ], |
|---|
| | | almValue: [ |
|---|
| | | { required: true, message: '请输入告警值', trigger: 'blur' }, |
|---|
| | | ], |
|---|
| | | }, |
|---|
| | | atewayTypes: [], |
|---|
| | | commTypes: [], |
|---|
| | | form: { |
|---|
| | | almName: '', |
|---|
| | | almEarly: '', |
|---|
| | | almValue: "", |
|---|
| | | almEn: "", |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | }, |
|---|
| | | components: { |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | close() { |
|---|
| | | this.$emit("cancel"); |
|---|
| | | }, |
|---|
| | | update() { |
|---|
| | | this.$refs.form.validate((valid) => { |
|---|
| | | if (valid) { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | updateAlmConfig({ ...this.info, ...this.form, almEn: this.form.almEn * 1 }) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | this.$emit("success"); |
|---|
| | | this.$message.success("操作成功"); |
|---|
| | | } else { |
|---|
| | | this.$message.error("操作失败"); |
|---|
| | | } |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }); |
|---|
| | | } else { |
|---|
| | | this.$message.error('存在未验证通过的数据'); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() { |
|---|
| | | console.log(this.info, 'info') |
|---|
| | | if (this.info) { |
|---|
| | | this.form.almEarly = this.info.almEarly; |
|---|
| | | this.form.almEn = !!this.info.almEn; |
|---|
| | | this.form.almValue = this.info.almValue; |
|---|
| | | this.form.almName = this.info.almName; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .input { |
|---|
| | | color: #000; |
|---|
| | | border: 1px #cccccc solid; |
|---|
| | | flex: 1; |
|---|
| | | border-radius: 6px; |
|---|
| | | margin-left: 6px; |
|---|
| | | margin-right: 6px; |
|---|
| | | |
|---|
| | | /deep/ .el-input__inner { |
|---|
| | | color: inherit; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class="p-main flex-c"> |
|---|
| | | <panel class="panel p-content"> |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">断路器类型</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select v-model="breakeType" class="dark" size="mini" @change="getList" placeholder="请选择"> |
|---|
| | | <el-option v-for="(item, idx) in breakerTypeList" :key="'type_' + idx" :label="item" :value="item"> |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">断路器名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select v-model="breakeName" class="dark" size="mini" @change="getList" placeholder="请选择"> |
|---|
| | | <el-option v-for="(item, idx) in breakerNameList" :key="'type_' + idx" :label="item" :value="item"> |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">告警名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select v-model="almName" class="dark" size="mini" filterable placeholder="请选择"> |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option v-for="(item, idx) in almNameList" :key="'name_' + idx" :label="item" :value="item"> |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <!-- <div class="s-item"> |
|---|
| | | <div class="label">告警等级</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="almLevel" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in almLevels" |
|---|
| | | :key="'level_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="idx" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | <div class="s-item"> |
|---|
| | | <gradient-btn size="sm" @click="getList">查询</gradient-btn> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="table-wrap"> |
|---|
| | | <el-table id="batteryrTimequeryTable" stripe size="small" :data="table.datas" height="100%" class="table-dark" |
|---|
| | | tooltip-effect="light"> |
|---|
| | | <el-table-column label="序号" type="index" width="80"></el-table-column> |
|---|
| | | <el-table-column v-for="header in table.headers" :key="header.prop" :prop="header.prop" :label="header.label" |
|---|
| | | :width="header.width" :min-width="header.minWidth" show-overflow-tooltip align="center"></el-table-column> |
|---|
| | | <el-table-column label="是否启用" width="120" align="center"> |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-checkbox :value="!!scope.row.almEn" disabled></el-checkbox> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | <el-table-column prop="cztime" fixed="right" width="240px" align="center" label="操作"> |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-button class="yellow" size="mini" @click="edit(scope.row)">编辑</el-button> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
| | | </div> |
|---|
| | | <!-- 底部分页 --> |
|---|
| | | <el-pagination class="pages center dark" :current-page="pageNum" @size-change="handleSizeChange" |
|---|
| | | @current-change="handleCurrentChange" :page-sizes="[10, 20, 30, 50, 100]" :page-size="pageSize" |
|---|
| | | layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination> |
|---|
| | | </div> |
|---|
| | | </panel> |
|---|
| | | <el-dialog title="编辑告警参数" :visible.sync="editVisible" top="100px" :close-on-click-modal="false" class="dialog-center" |
|---|
| | | width="600px" center> |
|---|
| | | <edit v-if="editVisible" @success="updateOk" :info="info" @cancel="onCanel"></edit> |
|---|
| | | </el-dialog> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import Panel from "@/components/panel.vue"; |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | import Edit from './edit'; |
|---|
| | | |
|---|
| | | import { getList, getAlmName, updateAlmConfig } from "./js/apis"; |
|---|
| | | import { getBreakerName, getBreakerType } from '../devManager/js/apis'; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | |
|---|
| | | components: { |
|---|
| | | Panel, |
|---|
| | | gradientBtn, |
|---|
| | | Edit, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | info: {}, |
|---|
| | | editVisible: false, |
|---|
| | | almNameList: [], |
|---|
| | | breakerNameList: [], |
|---|
| | | breakerTypeList: [], |
|---|
| | | pageNum: 1, |
|---|
| | | pageSize: 10, |
|---|
| | | almName: '', |
|---|
| | | breakeName: '', |
|---|
| | | breakeType: '', |
|---|
| | | total: 0, |
|---|
| | | table: { |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "breakerAddr", |
|---|
| | | label: "断路器位置", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "breakerType", |
|---|
| | | label: "断路器类型", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "breakerName", |
|---|
| | | label: "断路器名称", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almName", |
|---|
| | | label: "告警名称", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // prop: "almLevelStr", |
|---|
| | | // label: "告警等级", |
|---|
| | | // width: 120, |
|---|
| | | // }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | | label: "告警类型", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almEarly", |
|---|
| | | label: "预警值", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almValue", |
|---|
| | | label: "告警值", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | datas: [], |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | changeLevel(level) { |
|---|
| | | this.almLevel = level; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | changeType(value) { |
|---|
| | | this.devType = value; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | updateOk() { |
|---|
| | | this.getList(); |
|---|
| | | this.editVisible = false; |
|---|
| | | }, |
|---|
| | | onCanel() { |
|---|
| | | this.editVisible = false; |
|---|
| | | }, |
|---|
| | | getList() { |
|---|
| | | let params = { |
|---|
| | | pageCurr: this.pageNum, |
|---|
| | | pageSize: this.pageSize, |
|---|
| | | almName: this.almName || undefined, |
|---|
| | | breakeName: this.breakeName || undefined, |
|---|
| | | breakeType: this.breakeType || undefined, |
|---|
| | | }; |
|---|
| | | console.log("=====9=", params, JSON.stringify(params)); |
|---|
| | | getList(params) |
|---|
| | | .then((res) => { |
|---|
| | | let { |
|---|
| | | code, |
|---|
| | | data, |
|---|
| | | data2: { list, total }, |
|---|
| | | } = res.data; |
|---|
| | | let list1 = []; |
|---|
| | | let total1 = 0; |
|---|
| | | if (code && data) { |
|---|
| | | list1 = list.map((v) => { |
|---|
| | | // v.breakerTypeStr = ['', '交流微断路器', '直流微断路器'][v.breakerInf.breakerType]; |
|---|
| | | v.breakerAddr = v.breakerInf.breakerAddr; |
|---|
| | | v.breakerName = v.breakerInf.breakerName; |
|---|
| | | v.almLevelStr = ['', '一般', '重大', '紧急'][v.almLevel]; |
|---|
| | | return v; |
|---|
| | | }); |
|---|
| | | total1 = total; |
|---|
| | | } |
|---|
| | | this.table.datas = list1; |
|---|
| | | this.total = total1; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | edit(row) { |
|---|
| | | this.info = row; |
|---|
| | | this.editVisible = true; |
|---|
| | | }, |
|---|
| | | // 展示数据数量 |
|---|
| | | handleSizeChange(val) { |
|---|
| | | this.pageSize = val; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | // 翻页 |
|---|
| | | handleCurrentChange(val) { |
|---|
| | | this.pageNum = val; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | getAlmName() { |
|---|
| | | getAlmName().then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.almNameList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | getBreakerName() { |
|---|
| | | getBreakerName().then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.breakerNameList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | getBreakerType() { |
|---|
| | | getBreakerType().then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.breakerTypeList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() { |
|---|
| | | this.getAlmName(); |
|---|
| | | this.getBreakerName(); |
|---|
| | | this.getBreakerType(); |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .p-main { |
|---|
| | | height: 100%; |
|---|
| | | |
|---|
| | | .btn-grp { |
|---|
| | | .btn-alarm { |
|---|
| | | width: 160px; |
|---|
| | | height: 30px; |
|---|
| | | color: #fff; |
|---|
| | | font-size: 18px; |
|---|
| | | font-weight: bold; |
|---|
| | | padding: 0 6px; |
|---|
| | | border: 0 none; |
|---|
| | | |
|---|
| | | /deep/ span { |
|---|
| | | display: flex; |
|---|
| | | color: inherit; |
|---|
| | | justify-content: space-between; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | background: #fff; |
|---|
| | | border-radius: 4px; |
|---|
| | | padding: 2px 16px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.levelall { |
|---|
| | | background: #78eef8; |
|---|
| | | |
|---|
| | | color: #011f39; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | background: #011f39; |
|---|
| | | color: #78eef8; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level0 { |
|---|
| | | background: #ff3801; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #ff3801; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level1 { |
|---|
| | | background: #f69f40; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #f69f40; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level2 { |
|---|
| | | background: #4871e3; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #4871e3; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.type { |
|---|
| | | background: #4871e3; |
|---|
| | | width: auto; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | margin-left: 1em; |
|---|
| | | color: #4871e3; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .p-content { |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 4px; |
|---|
| | | |
|---|
| | | /deep/ .content { |
|---|
| | | background: #011f39; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .panel-content { |
|---|
| | | height: 100%; |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .search { |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | padding: 0 0.4em; |
|---|
| | | |
|---|
| | | .s-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .label { |
|---|
| | | color: #78eef8; |
|---|
| | | |
|---|
| | | &::after { |
|---|
| | | content: ":"; |
|---|
| | | } |
|---|
| | | |
|---|
| | | margin-right: 0.4em; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .table-wrap { |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 6px; |
|---|
| | | margin-bottom: 6px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/ .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { |
|---|
| | | background-color: #2155ff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | import axios from "axios"; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 查询 分页 |
|---|
| | | */ |
|---|
| | | export const getList = (params) => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "KPowerDevBreakAlarmConfig/getAlmConfig", |
|---|
| | | params |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 获取告警名称 下拉 |
|---|
| | | */ |
|---|
| | | export const getAlmName = () => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "KPowerDevBreakAlarmConfig/getAlmName", |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 编辑告警配置 |
|---|
| | | */ |
|---|
| | | export const updateAlmConfig = (data) => { |
|---|
| | | return axios({ |
|---|
| | | method: "POST", |
|---|
| | | url: "KPowerDevBreakAlarmConfig/updateAlmConfig", |
|---|
| | | data |
|---|
| | | }); |
|---|
| | | }; |
|---|
| File was renamed from src/views/testRecord/details.vue |
| | |
|---|
| | | <template> |
|---|
| | | <div class="p-main flex-c"> |
|---|
| | | <!-- 筛选 --> |
|---|
| | | <div class="filter"> |
|---|
| | | <div class="filter-item"> |
|---|
| | | <div class="label">断路器名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-cascader :options="options" filterable size="mini"></el-cascader> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="filter-item"> |
|---|
| | | <div class="label">动作日期</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-date-picker v-model="value1" type="date" size="mini" value-format="yyyy-MM-dd" placeholder="选择日期"> |
|---|
| | | </el-date-picker> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="filter-item"> |
|---|
| | | <gradient-btn size="sm" @click="search">查询</gradient-btn> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <!-- 状态栏 --> |
|---|
| | | <div class="info flex-r"> |
|---|
| | | <div class="info-item"> |
|---|
| | |
|---|
| | | <script> |
|---|
| | | import Panel from "@/components/panel.vue"; |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | import stepLine from '@/components/stepLine'; |
|---|
| | | import stepLine from "@/components/stepLine"; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: {}, |
|---|
| | | methods: { |
|---|
| | | getList() {}, |
|---|
| | | search() { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() {}, |
|---|
| | | }; |
|---|
| | |
|---|
| | | } |
|---|
| | | .chart-contain { |
|---|
| | | margin-top: 8px; |
|---|
| | | height: 300px; |
|---|
| | | height: 220px; |
|---|
| | | .name-panel { |
|---|
| | | background: #00253f; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | justify-content: space-around; |
|---|
| | | align-items: center; |
|---|
| | | width: 180px; |
|---|
| | | padding: 10px; |
|---|
| | | margin-right: 10px; |
|---|
| | | .row { |
|---|
| | |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | .switch-name { |
|---|
| | | color: #78EEF8; |
|---|
| | | color: #78eef8; |
|---|
| | | font-size: 24px; |
|---|
| | | font-weight: 700; |
|---|
| | | text-align: center; |
|---|
| | | } |
|---|
| | | .num { |
|---|
| | | color: #78eef8; |
|---|
| | |
|---|
| | | } |
|---|
| | | .search { |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-around; |
|---|
| | | justify-content: space-between; |
|---|
| | | .s-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </style> |
|---|
copy from src/views/testRecord/index.vue
copy to src/views/disjunctorTestRecord/index.vue
| File was copied from src/views/testRecord/index.vue |
| | |
|---|
| | | <div class="label">测控线路</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="devType" |
|---|
| | | v-model="breakerAddr" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in devtypes" |
|---|
| | | v-for="(item, idx) in breakerAddrList" |
|---|
| | | :key="'type_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="idx" |
|---|
| | |
|---|
| | | <div class="label">断路器名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="almLevel" |
|---|
| | | v-model="breakerName" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in almLevels" |
|---|
| | | v-for="(item, idx) in breakerNameList" |
|---|
| | | :key="'level_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="idx" |
|---|
| | |
|---|
| | | import Panel from "@/components/panel.vue"; |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | |
|---|
| | | import createWs from "@/assets/js/websocket/plus"; |
|---|
| | | const WSMixin = createWs("ckPowerDevAlarmHisCount"); |
|---|
| | | |
|---|
| | | import { getList } from "./js/apis"; |
|---|
| | | import { |
|---|
| | | getBreakerAddr, |
|---|
| | | getBreakerType, |
|---|
| | | getBreakerName, |
|---|
| | | } from "@/views/devManager/js/apis"; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | |
|---|
| | | mixins: [WSMixin], |
|---|
| | | components: { |
|---|
| | | Panel, |
|---|
| | | gradientBtn, |
|---|
| | |
|---|
| | | almCount: {}, |
|---|
| | | pageNum: 1, |
|---|
| | | pageSize: 10, |
|---|
| | | devType: 0, |
|---|
| | | almLevel: 0, |
|---|
| | | breakerAddr: "", |
|---|
| | | breakerName: "", |
|---|
| | | date1: "", |
|---|
| | | date2: "", |
|---|
| | | devtypes: ["全部", "交流配电柜", "直流配电柜", "高频开关电源柜"], |
|---|
| | | almLevels: ["全部", "一般", "重大", "紧急"], |
|---|
| | | breakerAddrList: [], |
|---|
| | | breakerNameList: [], |
|---|
| | | total: 0, |
|---|
| | | table: { |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "devName", |
|---|
| | | prop: "scope", |
|---|
| | | label: "断路器位置", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almName", |
|---|
| | | prop: "number", |
|---|
| | | label: "断路器名称", |
|---|
| | | width: 180, |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | | prop: "createDay", |
|---|
| | | label: "测控日期", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almStartTime", |
|---|
| | | label: "动作总次数", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almConfirmedTime", |
|---|
| | | label: "合闸次数", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almIsConfirmed", |
|---|
| | | label: "分闸次数", |
|---|
| | | prop: "operateType", |
|---|
| | | label: "动作", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // prop: "almStartTime", |
|---|
| | | // label: "动作总次数", |
|---|
| | | // width: 180, |
|---|
| | | // }, |
|---|
| | | // { |
|---|
| | | // prop: "almConfirmedTime", |
|---|
| | | // label: "合闸次数", |
|---|
| | | // width: 180, |
|---|
| | | // }, |
|---|
| | | // { |
|---|
| | | // prop: "almIsConfirmed", |
|---|
| | | // label: "分闸次数", |
|---|
| | | // width: 120, |
|---|
| | | // }, |
|---|
| | | ], |
|---|
| | | datas: [ |
|---|
| | | { |
|---|
| | |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | getBreakerName() { |
|---|
| | | getBreakerName() |
|---|
| | | .then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.breakerNameList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getBreakerAddr() { |
|---|
| | | getBreakerAddr() |
|---|
| | | .then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data, data2 } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data2; |
|---|
| | | } |
|---|
| | | this.breakerAddrList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | details() { |
|---|
| | | this.$router.push("/test-record/details"); |
|---|
| | | }, |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { |
|---|
| | | data: { list, total }, |
|---|
| | | } = JSON.parse(res.data); |
|---|
| | | this.table.datas = list.map((v) => { |
|---|
| | | v.devName = ["", "交流配电柜", "直流配电柜", "高频开关电源柜"][ |
|---|
| | | v.devType |
|---|
| | | ]; |
|---|
| | | v.almLevelStr = ["", "一般", "重大", "紧急"][v.almLevel]; |
|---|
| | | return v; |
|---|
| | | }); |
|---|
| | | this.total = total; |
|---|
| | | }, |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { data } = JSON.parse(res.data); |
|---|
| | | this.almCount = data; |
|---|
| | | this.$router.push("/data-record/disjunctor-details"); |
|---|
| | | }, |
|---|
| | | getList() { |
|---|
| | | let params = { |
|---|
| | | pageNum: this.pageNum, |
|---|
| | | pageSize: this.pageSize, |
|---|
| | | devType: this.devType, |
|---|
| | | almStartTime: this.date1 |
|---|
| | | ? this.date1 + " 00:00:00" |
|---|
| | | : "2023-01-01 00:00:00", |
|---|
| | | almStartTime1: this.date2 |
|---|
| | | ? this.date2 + " 23:59:59" |
|---|
| | | : new Date().format("yyyy-MM-dd hh:mm:ss"), |
|---|
| | | almLevel: this.almLevel, |
|---|
| | | // devType: this.devType, |
|---|
| | | // almStartTime: this.date1 |
|---|
| | | // ? this.date1 + " 00:00:00" |
|---|
| | | // : "2023-01-01 00:00:00", |
|---|
| | | // almStartTime1: this.date2 |
|---|
| | | // ? this.date2 + " 23:59:59" |
|---|
| | | // : new Date().format("yyyy-MM-dd hh:mm:ss"), |
|---|
| | | // almLevel: this.almLevel, |
|---|
| | | }; |
|---|
| | | console.log("=====9=", params, JSON.stringify(params)); |
|---|
| | | // this.SOCKET1.send(JSON.stringify(params)); |
|---|
| | |
|---|
| | | let total1 = 0; |
|---|
| | | if (code) { |
|---|
| | | list1 = list.map((v) => { |
|---|
| | | v.devName = ["", "交流配电柜", "直流配电柜", "高频开关电源柜"][ |
|---|
| | | v.devType |
|---|
| | | ]; |
|---|
| | | v.almLevelStr = ["", "一般", "重大", "紧急"][v.almLevel]; |
|---|
| | | v.operateType = v.status ? '合闸' : '分闸'; |
|---|
| | | return v; |
|---|
| | | }); |
|---|
| | | total1 = total; |
|---|
| | |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() {}, |
|---|
| | | mounted() { |
|---|
| | | this.getBreakerAddr(); |
|---|
| | | this.getBreakerName(); |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | |
|---|
| | | background-color: #2155ff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | import axios from "axios"; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 查询 分页 |
|---|
| | | */ |
|---|
| | | export const getList = (data) => { |
|---|
| | | return axios({ |
|---|
| | | method: "POST", |
|---|
| | | url: "ckPowerDevBreakerControlLog/getPage", |
|---|
| | | data |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | |
|---|
| | | import SwitchBox from "./components/switchBox"; |
|---|
| | | import ProtectorBox from "./components/protectorBox"; |
|---|
| | | import TextBox from "./components/textBox"; |
|---|
| | | import SvgLine from "./components/svgline"; |
|---|
| | | import SvgLine from "./components/svgLine"; |
|---|
| | | |
|---|
| | | import FileProcess from "./fileProcess"; |
|---|
| | | import getWebUrl from "@/assets/js/getWebUrl"; |
|---|
| | |
|---|
| | | <div class="img" @click="redirect(0)"> |
|---|
| | | <el-image :src="pdgImg" fit="fill"></el-image> |
|---|
| | | </div> |
|---|
| | | <div class="state"> |
|---|
| | | <!-- <div class="state"> |
|---|
| | | <div class="s-row"> |
|---|
| | | 运行: |
|---|
| | | <div class="i"></div> |
|---|
| | |
|---|
| | | 通信: |
|---|
| | | <div class="i danger"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | </div> |
|---|
| | | <div class="main"> |
|---|
| | | <list-card |
|---|
| | |
|---|
| | | <div class="img" @click="redirect(1)"> |
|---|
| | | <el-image :src="kggImg" fit="fill"></el-image> |
|---|
| | | </div> |
|---|
| | | <div class="state"> |
|---|
| | | <!-- <div class="state"> |
|---|
| | | <div class="s-row"> |
|---|
| | | 运行: |
|---|
| | | <div class="i"></div> |
|---|
| | |
|---|
| | | 通信: |
|---|
| | | <div class="i danger"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | </div> |
|---|
| | | <div class="main"> |
|---|
| | | <list-card |
|---|
| | |
|---|
| | | <div class="img img3" @click="redirect(2)"> |
|---|
| | | <el-image :src="hrImg" fit="fill"></el-image> |
|---|
| | | </div> |
|---|
| | | <div class="state"> |
|---|
| | | <!-- <div class="state"> |
|---|
| | | <div class="s-row"> |
|---|
| | | 运行: |
|---|
| | | <div class="i"></div> |
|---|
| | |
|---|
| | | 通信: |
|---|
| | | <div class="i danger"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | </div> |
|---|
| | | <div class="main"> |
|---|
| | | <list-card |
|---|
| | |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: space-between; |
|---|
| | | justify-content: space-around; |
|---|
| | | } |
|---|
| | | .img { |
|---|
| | | width: 80px; |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class="card flex-c"> |
|---|
| | | <div class="card-title"> |
|---|
| | | <div class="flex-r"> |
|---|
| | | <div class="i"></div> |
|---|
| | | {{ title }} |
|---|
| | | </div> |
|---|
| | | <el-checkbox v-model="checked1" @change="changed"></el-checkbox> |
|---|
| | | </div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="row"> |
|---|
| | | 实时: |
|---|
| | | <div class="value">{{ value }}</div> |
|---|
| | | <div class="btn"></div> |
|---|
| | | </div> |
|---|
| | | <div class="row"> |
|---|
| | | 模拟: |
|---|
| | | <el-input-number |
|---|
| | | class="input" |
|---|
| | | size="mini" |
|---|
| | | :disabled="setFlag" |
|---|
| | | v-model="num" |
|---|
| | | :step="1" |
|---|
| | | ></el-input-number> |
|---|
| | | <div class="btn"> |
|---|
| | | <gradient-btn |
|---|
| | | :active="setFlag" |
|---|
| | | size="xs" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | @click="confirm" |
|---|
| | | >{{ setFlag ? btnText + "中" : btnText }}</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | import { updateYC } from "../js/apis"; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | props: { |
|---|
| | | option: { |
|---|
| | | type: Object, |
|---|
| | | required: true, |
|---|
| | | }, |
|---|
| | | datas: { |
|---|
| | | type: Object, |
|---|
| | | required: true, |
|---|
| | | }, |
|---|
| | | btnText: { |
|---|
| | | type: String, |
|---|
| | | default: "给定", |
|---|
| | | }, |
|---|
| | | checked: { |
|---|
| | | type: Boolean, |
|---|
| | | required: true, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | title() { |
|---|
| | | return this.option.label; |
|---|
| | | }, |
|---|
| | | tip() { |
|---|
| | | return this.option.tip; |
|---|
| | | }, |
|---|
| | | setFlag() { |
|---|
| | | return !!this.datas[this.option.flag]; |
|---|
| | | }, |
|---|
| | | value() { |
|---|
| | | let { datas, option } = this; |
|---|
| | | return this.setFlag ? datas[option.key1] : datas[option.key0]; |
|---|
| | | }, |
|---|
| | | hasPermission() { |
|---|
| | | return this.$store.state.user.downloadFlag == 1; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | datas(n, o) { |
|---|
| | | if (o.isEmpty && !n.inEmpty) { |
|---|
| | | this.num = this.datas[this.option.key1]; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | checked(n) { |
|---|
| | | this.checked1 = n; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | checked1: this.checked, |
|---|
| | | // checked: false, |
|---|
| | | num: 0, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | components: { |
|---|
| | | gradientBtn, |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | changed() { |
|---|
| | | this.$emit("update:checked", this.checked1); |
|---|
| | | }, |
|---|
| | | confirm() { |
|---|
| | | let title = ""; |
|---|
| | | let flag = 0; |
|---|
| | | let num; |
|---|
| | | if (this.setFlag) { |
|---|
| | | title = "是否取消给定?"; |
|---|
| | | flag = 0; |
|---|
| | | } else { |
|---|
| | | title = "是否给定?"; |
|---|
| | | flag = 1; |
|---|
| | | num = this.num; |
|---|
| | | } |
|---|
| | | this.$confirm(title, "提示", { |
|---|
| | | type: "warning", |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | // console.log('调用结定接口', this.num, this.option.key1); |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | let params = {}; |
|---|
| | | params[this.option.key1] = num; |
|---|
| | | params[this.option.flag] = flag; |
|---|
| | | updateYC(params) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data, msg } = res.data; |
|---|
| | | this.$layer.close(loading); |
|---|
| | | this.$message(msg); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | .catch(() => {}); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() {}, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .flex-r { |
|---|
| | | display: flex; |
|---|
| | | flex-direction: row; |
|---|
| | | } |
|---|
| | | .flex-c { |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | } |
|---|
| | | .card { |
|---|
| | | height: 110px; |
|---|
| | | border: 1px solid #3e8d9d; |
|---|
| | | border-radius: 4px; |
|---|
| | | color: #fff; |
|---|
| | | overflow: hidden; |
|---|
| | | .card-title { |
|---|
| | | background: #0c4d77; |
|---|
| | | height: 30px; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | align-items: center; |
|---|
| | | padding-right: 6px; |
|---|
| | | } |
|---|
| | | .i { |
|---|
| | | margin-left: 4px; |
|---|
| | | margin-right: 6px; |
|---|
| | | width: 20px; |
|---|
| | | height: 20px; |
|---|
| | | border-radius: 50%; |
|---|
| | | background: #77edf6 url("../../../assets/images/gantan.png") 50% 50% / auto |
|---|
| | | 60% no-repeat; |
|---|
| | | } |
|---|
| | | .card-content { |
|---|
| | | flex: 1; |
|---|
| | | background: #011f39; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | padding: 6px; |
|---|
| | | } |
|---|
| | | .value { |
|---|
| | | flex: 1; |
|---|
| | | background: #fff; |
|---|
| | | color: #000; |
|---|
| | | margin-left: 6px; |
|---|
| | | margin-right: 6px; |
|---|
| | | padding-left: 6px; |
|---|
| | | height: 26px; |
|---|
| | | line-height: 26px; |
|---|
| | | border-radius: 6px; |
|---|
| | | } |
|---|
| | | .input { |
|---|
| | | color: #000; |
|---|
| | | flex: 1; |
|---|
| | | margin-left: 6px; |
|---|
| | | margin-right: 6px; |
|---|
| | | /deep/ .el-input__inner { |
|---|
| | | color: inherit; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .btn { |
|---|
| | | width: 60px; |
|---|
| | | } |
|---|
| | | .row { |
|---|
| | | flex: 1; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class="card flex-c"> |
|---|
| | | <div class="card-title"> |
|---|
| | | <div class="flex-r"> |
|---|
| | | <el-tooltip effect="dark" :content="tip" placement="top-start"> |
|---|
| | | <div class="i"></div> |
|---|
| | | </el-tooltip> |
|---|
| | | {{ title }} |
|---|
| | | </div> |
|---|
| | | <el-checkbox v-model="checked1" @change="changed"></el-checkbox> |
|---|
| | | </div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="col"> |
|---|
| | | 实时: |
|---|
| | | <div :class="['value', { alarm: !!value }]"> |
|---|
| | | {{ value ? "告警" : "正常" }} |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="col"> |
|---|
| | | 模拟: |
|---|
| | | <div class="btn"> |
|---|
| | | <gradient-btn |
|---|
| | | :active="setFlag" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | @click="handlerClick" |
|---|
| | | size="xs" |
|---|
| | | >{{ setFlag ? "执行中" : "执行" }}</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | import { updateYX } from "../js/apis"; |
|---|
| | | import changeBinaryBits from "@/assets/js/changeBinaryBits"; |
|---|
| | | import getBit from "@/assets/js/getBit"; |
|---|
| | | import setBitAtPositions from "@/assets/js/setBitAtPositions"; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | props: { |
|---|
| | | option: { |
|---|
| | | type: Object, |
|---|
| | | required: true, |
|---|
| | | }, |
|---|
| | | datas: { |
|---|
| | | type: Object, |
|---|
| | | required: true, |
|---|
| | | }, |
|---|
| | | checked: { |
|---|
| | | type: Boolean, |
|---|
| | | required: true, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | checked(n) { |
|---|
| | | this.checked1 = n; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | checked1: this.checked, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | hasPermission() { |
|---|
| | | return this.$store.state.user.downloadFlag == 1; |
|---|
| | | }, |
|---|
| | | title() { |
|---|
| | | return this.option.label; |
|---|
| | | }, |
|---|
| | | tip() { |
|---|
| | | return this.option.tip; |
|---|
| | | }, |
|---|
| | | setFlag() { |
|---|
| | | let { flag, childrenCount, index } = this.option; |
|---|
| | | if (childrenCount) { |
|---|
| | | // 通过index获得它在flag数组中的index |
|---|
| | | let propIdx = Math.floor(index / 25); |
|---|
| | | let prop_flag = flag[propIdx]; |
|---|
| | | let _flag = this.datas[prop_flag]; |
|---|
| | | return !!getBit(_flag, index % 25); |
|---|
| | | } else { |
|---|
| | | return !!this.datas[flag]; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | value() { |
|---|
| | | let { |
|---|
| | | datas, |
|---|
| | | option: { key0, key1, childrenCount, index }, |
|---|
| | | } = this; |
|---|
| | | if (childrenCount) { |
|---|
| | | // 通过index获得它在flag数组中的index |
|---|
| | | let propIdx = Math.floor(index / 25); |
|---|
| | | let prop_key0 = key0[propIdx]; |
|---|
| | | let prop_key1 = key1[propIdx]; |
|---|
| | | let _key0 = datas[prop_key0]; |
|---|
| | | let _key1 = datas[prop_key1]; |
|---|
| | | return !this.setFlag |
|---|
| | | ? getBit(_key1, index % 25) |
|---|
| | | : getBit(_key0, index % 25); |
|---|
| | | } else { |
|---|
| | | return this.setFlag ? datas[key1] : datas[key0]; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | components: { |
|---|
| | | gradientBtn, |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | changed() { |
|---|
| | | this.$emit("update:checked", this.checked1); |
|---|
| | | }, |
|---|
| | | handlerClick() { |
|---|
| | | let title = ""; |
|---|
| | | let pflag = 0; |
|---|
| | | if (this.setFlag) { |
|---|
| | | title = "是否取消执行?"; |
|---|
| | | pflag = 0; |
|---|
| | | } else { |
|---|
| | | title = "是否执行?"; |
|---|
| | | pflag = 1; |
|---|
| | | } |
|---|
| | | this.$confirm(title, "提示", { |
|---|
| | | type: "warning", |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | let params = {}; |
|---|
| | | let { key1, flag, childrenCount, index } = this.option; |
|---|
| | | if (childrenCount) { |
|---|
| | | // 需要处理同一个字段的值 |
|---|
| | | // 通过index获得它在flag数组中的index |
|---|
| | | let propIdx = Math.floor(index / 25); |
|---|
| | | let prop_key1 = key1[propIdx]; |
|---|
| | | let prop_flag = flag[propIdx]; |
|---|
| | | let _key1 = this.datas[prop_key1]; |
|---|
| | | let _flag = this.datas[prop_flag]; |
|---|
| | | // console.log(_key1, _flag, propIdx, index, '====idx', index % 25); |
|---|
| | | params[prop_key1] = setBitAtPositions(_key1, [index % 25], pflag); |
|---|
| | | params[prop_flag] = changeBinaryBits(_flag, [index % 25]); |
|---|
| | | } else { |
|---|
| | | params[key1] = 1; |
|---|
| | | params[flag] = pflag; |
|---|
| | | } |
|---|
| | | updateYX(params) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data, msg } = res.data; |
|---|
| | | this.$layer.close(loading); |
|---|
| | | this.$message(msg); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | .catch(() => {}); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() {}, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .flex-r { |
|---|
| | | display: flex; |
|---|
| | | flex-direction: row; |
|---|
| | | } |
|---|
| | | .flex-c { |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | } |
|---|
| | | .card { |
|---|
| | | height: 100px; |
|---|
| | | border: 1px solid #77edf6; |
|---|
| | | border-radius: 4px; |
|---|
| | | color: #fff; |
|---|
| | | overflow: hidden; |
|---|
| | | .card-title { |
|---|
| | | background: #011f39; |
|---|
| | | height: 30px; |
|---|
| | | color: #77edf6; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | align-items: center; |
|---|
| | | padding-right: 6px; |
|---|
| | | border-bottom: 1px solid #77edf6; |
|---|
| | | } |
|---|
| | | .i { |
|---|
| | | cursor: pointer; |
|---|
| | | margin-left: 4px; |
|---|
| | | margin-right: 6px; |
|---|
| | | width: 20px; |
|---|
| | | height: 20px; |
|---|
| | | border-radius: 50%; |
|---|
| | | background: #77edf6 url("../../../assets/images/gantan.png") 50% 50% / auto |
|---|
| | | 60% no-repeat; |
|---|
| | | } |
|---|
| | | .card-content { |
|---|
| | | flex: 1; |
|---|
| | | background: #0c4d77; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | align-items: center; |
|---|
| | | padding: 6px; |
|---|
| | | } |
|---|
| | | .col { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | .value { |
|---|
| | | flex: 1; |
|---|
| | | color: #77edf6; |
|---|
| | | margin-left: 6px; |
|---|
| | | margin-right: 6px; |
|---|
| | | padding-left: 6px; |
|---|
| | | height: 26px; |
|---|
| | | line-height: 26px; |
|---|
| | | border-radius: 6px; |
|---|
| | | &.alarm { |
|---|
| | | color: #ff4f45; |
|---|
| | | font-weight: 700; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .input { |
|---|
| | | color: #000; |
|---|
| | | flex: 1; |
|---|
| | | margin-left: 6px; |
|---|
| | | margin-right: 6px; |
|---|
| | | /deep/ .el-input__inner { |
|---|
| | | color: inherit; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .btn { |
|---|
| | | width: 76px; |
|---|
| | | padding-left: 8px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class="card flex-c"> |
|---|
| | | <div class="card-title"> |
|---|
| | | <div class="flex-r"> |
|---|
| | | <div class="i"></div> |
|---|
| | | {{ title }} |
|---|
| | | </div> |
|---|
| | | <el-checkbox v-model="checked"></el-checkbox> |
|---|
| | | </div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="row"> |
|---|
| | | 实时: |
|---|
| | | <div class="value">18</div> |
|---|
| | | <div class="btn"></div> |
|---|
| | | </div> |
|---|
| | | <div class="row"> |
|---|
| | | 模拟: |
|---|
| | | <ip-input |
|---|
| | | class="input" |
|---|
| | | :onChange="change" |
|---|
| | | :onBlur="blur" |
|---|
| | | :ip="ip" |
|---|
| | | ></ip-input> |
|---|
| | | <div class="btn"> |
|---|
| | | <gradient-btn |
|---|
| | | :active="setFlag" |
|---|
| | | size="xs" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | >{{ setFlag ? "设定中" : "设定" }}</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | import IpInput from "@/components/ipInput.vue"; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | props: { |
|---|
| | | title: { |
|---|
| | | type: String, |
|---|
| | | default: "我是标题", |
|---|
| | | }, |
|---|
| | | setFlag: { |
|---|
| | | type: Boolean, |
|---|
| | | default: false, |
|---|
| | | }, |
|---|
| | | ip: { |
|---|
| | | type: String, |
|---|
| | | required: true, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | checked: true, |
|---|
| | | num: 0, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | components: { |
|---|
| | | gradientBtn, |
|---|
| | | IpInput, |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | hasPermission() { |
|---|
| | | return this.$store.state.user.downloadFlag == 1; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | change(value) { |
|---|
| | | // console.log(value, 'ip change', value.split('.')); |
|---|
| | | let segments = value.split("."); |
|---|
| | | if (!segments.some((v) => v == "")) { |
|---|
| | | // console.log(value, 'ip', this.ip); |
|---|
| | | this.$emit("update:ip", value); |
|---|
| | | this.$emit("change", value); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | blur(value) { |
|---|
| | | // console.log(value, 'blur', this.ip); |
|---|
| | | this.$emit("update:ip", value); |
|---|
| | | this.$emit("blur", value); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() {}, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .flex-r { |
|---|
| | | display: flex; |
|---|
| | | flex-direction: row; |
|---|
| | | } |
|---|
| | | .flex-c { |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | } |
|---|
| | | .card { |
|---|
| | | height: 110px; |
|---|
| | | border: 1px solid #3e8d9d; |
|---|
| | | border-radius: 4px; |
|---|
| | | color: #fff; |
|---|
| | | overflow: hidden; |
|---|
| | | .card-title { |
|---|
| | | background: #0c4d77; |
|---|
| | | height: 30px; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | align-items: center; |
|---|
| | | padding-right: 6px; |
|---|
| | | } |
|---|
| | | .i { |
|---|
| | | margin-left: 4px; |
|---|
| | | margin-right: 6px; |
|---|
| | | width: 20px; |
|---|
| | | height: 20px; |
|---|
| | | border-radius: 50%; |
|---|
| | | background: #77edf6 url("../../../assets/images/gantan.png") 50% 50% / auto |
|---|
| | | 60% no-repeat; |
|---|
| | | } |
|---|
| | | .card-content { |
|---|
| | | flex: 1; |
|---|
| | | background: #011f39; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | padding: 6px; |
|---|
| | | } |
|---|
| | | .value { |
|---|
| | | flex: 1; |
|---|
| | | background: #fff; |
|---|
| | | color: #000; |
|---|
| | | margin-left: 6px; |
|---|
| | | margin-right: 6px; |
|---|
| | | padding-left: 6px; |
|---|
| | | height: 26px; |
|---|
| | | line-height: 26px; |
|---|
| | | border-radius: 6px; |
|---|
| | | } |
|---|
| | | .input { |
|---|
| | | color: #000; |
|---|
| | | flex: 1; |
|---|
| | | border-radius: 6px; |
|---|
| | | margin-left: 6px; |
|---|
| | | margin-right: 6px; |
|---|
| | | /deep/ .el-input__inner { |
|---|
| | | color: inherit; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .btn { |
|---|
| | | width: 76px; |
|---|
| | | } |
|---|
| | | .row { |
|---|
| | | flex: 1; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class="p-main"> |
|---|
| | | <div class="p-content flex-r"> |
|---|
| | | <panel class="panel left" title="遥调量模拟"> |
|---|
| | | <div slot="tools" class="btn-grp"> |
|---|
| | | <gradient-btn size="xs">全选</gradient-btn> |
|---|
| | | <gradient-btn size="xs" :disabled="!hasPermission" |
|---|
| | | >批量设定</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | <div class="content"> |
|---|
| | | <div class="grid1"> |
|---|
| | | <yc-grid :count="6" :config="[1, 2, 3]"> |
|---|
| | | <template v-slot="{ data, index }"> |
|---|
| | | <card |
|---|
| | | :option="{}" |
|---|
| | | :checked.sync="checkList1_gp[index]" |
|---|
| | | :datas="rtData" |
|---|
| | | ></card> |
|---|
| | | </template> |
|---|
| | | </yc-grid> |
|---|
| | | </div> |
|---|
| | | <div class="grid1"> |
|---|
| | | <yc-grid :count="3" :cols="2" :config="ips"> |
|---|
| | | <template v-slot="{ data, index }"> |
|---|
| | | <ip-card |
|---|
| | | :ip.sync="data[index].ip" |
|---|
| | | @change="changeIp" |
|---|
| | | ></ip-card> |
|---|
| | | </template> |
|---|
| | | </yc-grid> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </panel> |
|---|
| | | <panel class="panel right" title="遥控量模拟"> |
|---|
| | | <div class="content"> |
|---|
| | | <el-row class="el_row" :gutter="20"> |
|---|
| | | <el-col class="el_col" :span="12"> |
|---|
| | | <div class="card3"> |
|---|
| | | <div class="card-title">蓄电池放电模拟</div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">蓄电池实时状态:</div> |
|---|
| | | <div class="value">浮充</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">蓄电池放电模拟:</div> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <gradient-btn size="sm" :disabled="!hasPermission" |
|---|
| | | >开始放电</gradient-btn |
|---|
| | | > |
|---|
| | | <gradient-btn |
|---|
| | | active |
|---|
| | | size="sm" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | >停止放电</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | <el-col class="el_col" :span="12"> |
|---|
| | | <div class="card3"> |
|---|
| | | <div class="card-title">蓄电池内阻模拟</div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">蓄电池实时状态:</div> |
|---|
| | | <div class="value">浮充</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">内阻测试模拟:</div> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <gradient-btn size="sm" :disabled="!hasPermission" |
|---|
| | | >启动内阻测试</gradient-btn |
|---|
| | | > |
|---|
| | | <gradient-btn |
|---|
| | | active |
|---|
| | | size="sm" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | >停止内阻测试</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | <el-col class="el_col" :span="12"> |
|---|
| | | <div class="card3"> |
|---|
| | | <div class="card-title">核容装置K1/D1测试模拟</div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置状态:</div> |
|---|
| | | <div class="value">浮充</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">K1/D1测试模拟:</div> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <gradient-btn size="sm" :disabled="!hasPermission" |
|---|
| | | >启动K1/D1测试</gradient-btn |
|---|
| | | > |
|---|
| | | <gradient-btn |
|---|
| | | active |
|---|
| | | size="sm" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | >停止K1/D1测试</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | <el-col class="el_col" :span="12"> |
|---|
| | | <div class="card3"> |
|---|
| | | <div class="card-title">蓄电池内阻模拟</div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置状态:</div> |
|---|
| | | <div class="value">浮充</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">装置重启模拟:</div> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <gradient-btn size="sm" :disabled="!hasPermission" |
|---|
| | | >重启核容装置</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | <el-col class="el_col" :span="12"> |
|---|
| | | <div class="card3"> |
|---|
| | | <div class="card-title">核容装置IP配置</div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置IP地址:</div> |
|---|
| | | <div class="value">192.168.10.112</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置IP网关:</div> |
|---|
| | | <div class="value">192.168.10.1</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置子网掩码:</div> |
|---|
| | | <div class="value">255.255.255.0</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置配置IP地址:</div> |
|---|
| | | <div class="value">192.168.10.112</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置配置IP网关:</div> |
|---|
| | | <div class="value">192.168.10.1</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置配置子网掩码:</div> |
|---|
| | | <div class="value">255.255.255.0</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">装置重启模拟:</div> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <gradient-btn size="sm" :disabled="!hasPermission" |
|---|
| | | >暂时配置生效</gradient-btn |
|---|
| | | > |
|---|
| | | <gradient-btn |
|---|
| | | active |
|---|
| | | size="sm" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | >永久配置生效</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | </el-row> |
|---|
| | | </div> |
|---|
| | | </panel> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import Panel from "@/components/panel.vue"; |
|---|
| | | import ycGrid from "@/components/ycGrid.vue"; |
|---|
| | | import AlarmCard from "@/components/alarmCard.vue"; |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | import card from "./components/card"; |
|---|
| | | import card2 from "./components/card2"; |
|---|
| | | import IpCard from "./components/ipCard"; |
|---|
| | | |
|---|
| | | import props_const from "./js/const_props"; |
|---|
| | | const { props1, props2, param_acdc, param_gp } = props_const; |
|---|
| | | |
|---|
| | | import createWs from "@/assets/js/websocket/plus"; |
|---|
| | | const WSMixin = createWs("ckRtAndSignalAndHr", "ckDevRsAndRtAlm"); |
|---|
| | | import { updateYC, updateYX } from "./js/apis"; |
|---|
| | | import changeBinaryBits from "@/assets/js/changeBinaryBits"; |
|---|
| | | import setBitAtPositions from "@/assets/js/setBitAtPositions"; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | mixins: [WSMixin], |
|---|
| | | components: { |
|---|
| | | Panel, |
|---|
| | | ycGrid, |
|---|
| | | AlarmCard, |
|---|
| | | gradientBtn, |
|---|
| | | card, |
|---|
| | | card2, |
|---|
| | | IpCard, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | rtData: { |
|---|
| | | isEmpty: true, |
|---|
| | | }, |
|---|
| | | // props1, |
|---|
| | | // props2, |
|---|
| | | param_acdc, |
|---|
| | | param_gp, |
|---|
| | | checkList1_acdc: param_acdc.map(() => false), |
|---|
| | | checkList1_gp: param_gp.map(() => false), |
|---|
| | | checkList2_acdc: [], |
|---|
| | | checkList2_gp: [], |
|---|
| | | ips: [{ ip: "192.168.10.222" }, { ip: "255.0.0.0" }, { ip: "0.0.0.0" }], |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | // 在 created 钩子中初始化数据 |
|---|
| | | this.checkList2_acdc = this.acdc_alarms.map(() => false); |
|---|
| | | this.checkList2_gp = this.gp_alarms.map(() => false); |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | hasPermission() { |
|---|
| | | return this.$store.state.user.downloadFlag == 1; |
|---|
| | | }, |
|---|
| | | acdc_alarms() { |
|---|
| | | let arr = []; |
|---|
| | | for (let i = 0, j = props1.length; i < j; i++) { |
|---|
| | | let item = props1[i]; |
|---|
| | | if (item.childrenCount) { |
|---|
| | | for (let m = 0, n = item.childrenCount; m < n; m++) { |
|---|
| | | let idx = m + 1; |
|---|
| | | let mIdx = Math.floor(m / 25); |
|---|
| | | arr.push({ |
|---|
| | | label: item.label.replace("N", idx), |
|---|
| | | key0: item.key0, |
|---|
| | | key1: item.key1, |
|---|
| | | flag: item.flag, |
|---|
| | | childrenCount: item.childrenCount, |
|---|
| | | tip: item.tip.replace("N", idx), |
|---|
| | | index: m, |
|---|
| | | mainIdx: i + "_" + mIdx, |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | arr.push(item); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return arr; |
|---|
| | | }, |
|---|
| | | gp_alarms() { |
|---|
| | | let arr = []; |
|---|
| | | for (let i = 0, j = props2.length; i < j; i++) { |
|---|
| | | let item = props2[i]; |
|---|
| | | if (item.childrenCount) { |
|---|
| | | for (let m = 0, n = item.childrenCount; m < n; m++) { |
|---|
| | | let idx = m + 1; |
|---|
| | | let mIdx = Math.floor(m / 25); |
|---|
| | | arr.push({ |
|---|
| | | label: item.label.replace("N", idx), |
|---|
| | | key0: item.key0, |
|---|
| | | key1: item.key1, |
|---|
| | | flag: item.flag, |
|---|
| | | childrenCount: item.childrenCount, |
|---|
| | | tip: item.tip.replace("N", idx), |
|---|
| | | index: m, |
|---|
| | | mainIdx: i + "_" + mIdx, |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | arr.push(item); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return arr; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { data, data2, data3, data4 } = JSON.parse(res.data); |
|---|
| | | // console.log(data, "=====data??", data2); |
|---|
| | | // this.paramsAlram(data); |
|---|
| | | this.rtData = { |
|---|
| | | ...data, |
|---|
| | | ...data2, |
|---|
| | | ...data3, |
|---|
| | | }; |
|---|
| | | // this.monData = data4; |
|---|
| | | }, |
|---|
| | | selectAll(list) { |
|---|
| | | this[list] = this[list].map(() => true); |
|---|
| | | }, |
|---|
| | | batchYCSet(type) { |
|---|
| | | this.$confirm("确认批量给定?", "提示", { |
|---|
| | | type: "warning", |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | let params = {}; |
|---|
| | | let checkList = this["checkList1_" + type]; |
|---|
| | | checkList |
|---|
| | | .map((v, i) => ({ i, v })) |
|---|
| | | .filter((v) => v.v) |
|---|
| | | .forEach((v) => { |
|---|
| | | let refName = type + "_param_" + v.i; |
|---|
| | | let $el = this.$refs[refName]; |
|---|
| | | // console.log($el); |
|---|
| | | params[$el.option.key1] = $el.num; |
|---|
| | | params[$el.option.flag] = 1; |
|---|
| | | }); |
|---|
| | | |
|---|
| | | updateYC(params) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data, msg } = res.data; |
|---|
| | | this.$layer.close(loading); |
|---|
| | | this.$message(msg); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | .catch(() => {}); |
|---|
| | | }, |
|---|
| | | batchYXSet(type) { |
|---|
| | | this.$confirm("确认批量执行?", "提示", { |
|---|
| | | type: "warning", |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | let params = {}; |
|---|
| | | let checkList = this["checkList2_" + type]; |
|---|
| | | // 从被选中(打勾)的序号列表中 把对应同一个字段的合并为一个序号（N个同类型的每25个一个字段) (合并为一个序号取第一个用 并要想办法把合并的这些index保存来用) |
|---|
| | | // 用一个对象来存储是否有同组的已进来 |
|---|
| | | let obj = {}; |
|---|
| | | // 用一个数组来存储要处得的对象 每个元素{$el, indexs} $el 为组件引用 有同组的引用第一个 有同组的就有indexs 里面记录对应的索引 |
|---|
| | | let arr = []; |
|---|
| | | checkList |
|---|
| | | .map((v, i) => ({ i, v })) |
|---|
| | | .filter((v) => v.v) |
|---|
| | | .forEach((v) => { |
|---|
| | | let refName = type + "_alarm_" + v.i; |
|---|
| | | let $el = this.$refs[refName]; |
|---|
| | | let { |
|---|
| | | option: { key1, flag, childrenCount, index, mainIdx }, |
|---|
| | | } = $el; |
|---|
| | | if (childrenCount) { |
|---|
| | | obj[mainIdx] = obj[mainIdx] || { $el, indexs: [] }; |
|---|
| | | obj[mainIdx].indexs.push(index); |
|---|
| | | } else { |
|---|
| | | arr.push({ $el }); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | Object.keys(obj).forEach((v) => { |
|---|
| | | arr.push(obj[v]); |
|---|
| | | }); |
|---|
| | | arr.forEach((v) => { |
|---|
| | | if (v.indexs) { |
|---|
| | | let { |
|---|
| | | datas, |
|---|
| | | option: { key1, flag, index }, |
|---|
| | | } = v.$el; |
|---|
| | | // 需要处理同一个字段的值 |
|---|
| | | // 通过index获得它在flag数组中的index |
|---|
| | | let propIdx = Math.floor(index / 25); |
|---|
| | | let prop_key1 = key1[propIdx]; |
|---|
| | | let prop_flag = flag[propIdx]; |
|---|
| | | let _key1 = datas[prop_key1]; |
|---|
| | | let _flag = datas[prop_flag]; |
|---|
| | | params[prop_key1] = setBitAtPositions( |
|---|
| | | _key1, |
|---|
| | | v.indexs.map((vv) => vv % 25), |
|---|
| | | 1 |
|---|
| | | ); |
|---|
| | | params[prop_flag] = setBitAtPositions( |
|---|
| | | _flag, |
|---|
| | | v.indexs.map((vv) => vv % 25), |
|---|
| | | 1 |
|---|
| | | ); |
|---|
| | | } else { |
|---|
| | | params[v.$el.option.key1] = 1; |
|---|
| | | params[v.$el.option.flag] = 1; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | updateYX(params) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data, msg } = res.data; |
|---|
| | | this.$layer.close(loading); |
|---|
| | | this.$message(msg); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | .catch(() => {}); |
|---|
| | | }, |
|---|
| | | changeIp(ip) { |
|---|
| | | console.log(ip, "hhhhhh"); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() {}, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .p-main { |
|---|
| | | height: 100%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | .panel { |
|---|
| | | color: #fff; |
|---|
| | | // height: 100%; |
|---|
| | | flex: 1; |
|---|
| | | &.right { |
|---|
| | | margin-left: 10px; |
|---|
| | | flex: 1.44; |
|---|
| | | .content { |
|---|
| | | height: 100%; |
|---|
| | | padding: 10px 30px; |
|---|
| | | position: relative; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | justify-content: space-between; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .btn-grp { |
|---|
| | | padding: 10px; |
|---|
| | | display: flex; |
|---|
| | | } |
|---|
| | | .p-content { |
|---|
| | | height: 100%; |
|---|
| | | .content { |
|---|
| | | height: 100%; |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .grid1 { |
|---|
| | | height: 240px; |
|---|
| | | margin-bottom: 20px; |
|---|
| | | } |
|---|
| | | .card3 { |
|---|
| | | height: 100%; |
|---|
| | | border: 1px solid #3e8d9d; |
|---|
| | | border-radius: 4px; |
|---|
| | | color: #fff; |
|---|
| | | overflow: hidden; |
|---|
| | | .card-title { |
|---|
| | | background: #0c4d77; |
|---|
| | | height: 30px; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | align-items: center; |
|---|
| | | padding-left: 6px; |
|---|
| | | } |
|---|
| | | .card-content { |
|---|
| | | flex: 1; |
|---|
| | | background: #011f39; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | padding: 6px; |
|---|
| | | |
|---|
| | | .item-row { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | .label { |
|---|
| | | width: 12em; |
|---|
| | | line-height: 30px; |
|---|
| | | } |
|---|
| | | .value { |
|---|
| | | color: #78eef8; |
|---|
| | | } |
|---|
| | | .btn-grp { |
|---|
| | | padding-left: 0; |
|---|
| | | flex: 1; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | /deep/ .gradient-btn { |
|---|
| | | min-width: 110px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .scroller { |
|---|
| | | overflow-y: auto; |
|---|
| | | } |
|---|
| | | .el_col:nth-child(n + 3) { |
|---|
| | | margin-top: 20px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | import axios from "axios"; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 测控电源设备 遥测量设置 |
|---|
| | | * @returns |
|---|
| | | */ |
|---|
| | | export const updateYC = (data) => { |
|---|
| | | return axios({ |
|---|
| | | method: "POST", |
|---|
| | | url: "ckPowerDevSet/update", |
|---|
| | | data |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 测控电源设备 遥信量设置 |
|---|
| | | * @returns |
|---|
| | | */ |
|---|
| | | export const updateYX = (data) => { |
|---|
| | | return axios({ |
|---|
| | | method: "POST", |
|---|
| | | url: "ckPowerDevSignalSet/update", |
|---|
| | | data |
|---|
| | | }); |
|---|
| | | }; |
|---|
| New file |
| | |
|---|
| | | // 交直流 |
|---|
| | | const props1 = [ |
|---|
| | | { |
|---|
| | | label: "交流输入1停电", |
|---|
| | | key0: "acIn1PowerDownReal", |
|---|
| | | key1: "acIn1PowerDownFake", |
|---|
| | | flag: "acIn1PowerDownSt", |
|---|
| | | tip: "三相电压均小于告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流输入2停电", |
|---|
| | | key0: "acIn2PowerDownReal", |
|---|
| | | key1: "acIn2PowerDownFake", |
|---|
| | | flag: "acIn2PowerDownSt", |
|---|
| | | tip: "三相电压均小于告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流输入1防雷器故障", |
|---|
| | | key0: "acIn1ThunderErrReal", |
|---|
| | | key1: "acIn1ThunderErrFake", |
|---|
| | | flag: "acIn1ThunderErrSt", |
|---|
| | | tip: "防雷电路有故障", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流输入2防雷器故障", |
|---|
| | | key0: "acIn2ThunderErrReal", |
|---|
| | | key1: "acIn2ThunderErrFake", |
|---|
| | | flag: "acIn2ThunderErrSt", |
|---|
| | | tip: "防雷电路有故障", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流输入开关跳闸", |
|---|
| | | key0: "acIn1SwitchTripReal", |
|---|
| | | key1: "acIn1SwitchTripFake", |
|---|
| | | flag: "acIn1SwitchTripSt", |
|---|
| | | tip: "第1路交流输入空开跳闸", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流输入开关跳闸", |
|---|
| | | key0: "acIn2SwitchTripReal", |
|---|
| | | key1: "acIn2SwitchTripFake", |
|---|
| | | flag: "acIn2SwitchTripSt", |
|---|
| | | tip: "第2路交流输入空开跳闸", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流A相过压", |
|---|
| | | key0: "acIn1OverVolAReal", |
|---|
| | | key1: "acIn1OverVolAFake", |
|---|
| | | flag: "acIn1OverVolASt", |
|---|
| | | tip: "第1路交流A相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流A相欠压", |
|---|
| | | key0: "acIn1UnderVolAReal", |
|---|
| | | key1: "acIn1UnderVolAFake", |
|---|
| | | flag: "acIn1UnderVolASt", |
|---|
| | | tip: "第1路交流A相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流B相过压", |
|---|
| | | key0: "acIn1OverVolBReal", |
|---|
| | | key1: "acIn1OverVolBFake", |
|---|
| | | flag: "acIn1OverVolBSt", |
|---|
| | | tip: "第1路交流B相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流B相欠压", |
|---|
| | | key0: "acIn1UnderVolBReal", |
|---|
| | | key1: "acIn1UnderVolBFake", |
|---|
| | | flag: "acIn1UnderVolBSt", |
|---|
| | | tip: "第1路交流B相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流C相过压", |
|---|
| | | key0: "acIn1OverVolCReal", |
|---|
| | | key1: "acIn1OverVolCFake", |
|---|
| | | flag: "acIn1OverVolCSt", |
|---|
| | | tip: "第1路交流C相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流C相欠压", |
|---|
| | | key0: "acIn1UnderVolCReal", |
|---|
| | | key1: "acIn1UnderVolCFake", |
|---|
| | | flag: "acIn1UnderVolCSt", |
|---|
| | | tip: "第1路交流C相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流A相过压", |
|---|
| | | key0: "acIn2OverVolAReal", |
|---|
| | | key1: "acIn2OverVolAFake", |
|---|
| | | flag: "acIn2OverVolASt", |
|---|
| | | tip: "第2路交流A相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流A相欠压", |
|---|
| | | key0: "acIn2UnderVolAReal", |
|---|
| | | key1: "acIn2UnderVolAFake", |
|---|
| | | flag: "acIn2UnderVolASt", |
|---|
| | | tip: "第2路交流A相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流B相过压", |
|---|
| | | key0: "acIn2OverVolBReal", |
|---|
| | | key1: "acIn2OverVolBFake", |
|---|
| | | flag: "acIn2OverVolBSt", |
|---|
| | | tip: "第2路交流B相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流B相欠压", |
|---|
| | | key0: "acIn2UnderVolBReal", |
|---|
| | | key1: "acIn2UnderVolBFake", |
|---|
| | | flag: "acIn2UnderVolBSt", |
|---|
| | | tip: "第2路交流B相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流C相过压", |
|---|
| | | key0: "acIn2OverVolCReal", |
|---|
| | | key1: "acIn2OverVolCFake", |
|---|
| | | flag: "acIn2OverVolCSt", |
|---|
| | | tip: "第2路交流C相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流C相欠压", |
|---|
| | | key0: "acIn2UnderVolCReal", |
|---|
| | | key1: "acIn2UnderVolCFake", |
|---|
| | | flag: "acIn2UnderVolCSt", |
|---|
| | | tip: "第2路交流C相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流A相缺相", |
|---|
| | | key0: "acIn1LessVolAReal", |
|---|
| | | key1: "acIn1LessVolAFake", |
|---|
| | | flag: "acIn1LessVolASt", |
|---|
| | | tip: "第1路交流单相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流B相缺相", |
|---|
| | | key0: "acIn1LessVolBReal", |
|---|
| | | key1: "acIn1LessVolBFake", |
|---|
| | | flag: "acIn1LessVolBSt", |
|---|
| | | tip: "第1路交流单相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流C相缺相", |
|---|
| | | key0: "acIn1LessVolCReal", |
|---|
| | | key1: "acIn1LessVolCFake", |
|---|
| | | flag: "acIn1LessVolCSt", |
|---|
| | | tip: "第1路交流单相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流A相缺相", |
|---|
| | | key0: "acIn2LessVolAReal", |
|---|
| | | key1: "acIn2LessVolAFake", |
|---|
| | | flag: "acIn2LessVolASt", |
|---|
| | | tip: "第2路交流单相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流B相缺相", |
|---|
| | | key0: "acIn2LessVolBReal", |
|---|
| | | key1: "acIn2LessVolBFake", |
|---|
| | | flag: "acIn2LessVolBSt", |
|---|
| | | tip: "第2路交流单相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流C相缺相", |
|---|
| | | key0: "acIn2LessVolCReal", |
|---|
| | | key1: "acIn2LessVolCFake", |
|---|
| | | flag: "acIn2LessVolCSt", |
|---|
| | | tip: "第2路交流单相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流监控单元故障", |
|---|
| | | key0: "acMonitorErrReal", |
|---|
| | | key1: "acMonitorErrFake", |
|---|
| | | flag: "acMonitorErrSt", |
|---|
| | | tip: "监控单元硬件故障,或者采集交流数据失败", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "1段交流母线输出开关N跳闸", |
|---|
| | | key0: [ |
|---|
| | | "ac1OutSwitch1TripReal", |
|---|
| | | "ac1OutSwitch2TripReal", |
|---|
| | | "ac1OutSwitch3TripReal", |
|---|
| | | "ac1OutSwitch4TripReal", |
|---|
| | | ], |
|---|
| | | key1: [ |
|---|
| | | "ac1OutSwitch1TripFake", |
|---|
| | | "ac1OutSwitch2TripFake", |
|---|
| | | "ac1OutSwitch3TripFake", |
|---|
| | | "ac1OutSwitch4TripFake", |
|---|
| | | ], |
|---|
| | | flag: [ |
|---|
| | | "ac1OutSwitch1TripSt", |
|---|
| | | "ac1OutSwitch2TripSt", |
|---|
| | | "ac1OutSwitch3TripSt", |
|---|
| | | "ac1OutSwitch4TripSt", |
|---|
| | | ], |
|---|
| | | childrenCount: 100, |
|---|
| | | tip: "1段交流母线输出开关N跳闸", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "2段交流母线输出开关N跳闸", |
|---|
| | | key0: [ |
|---|
| | | "ac2OutSwitch1TripReal", |
|---|
| | | "ac2OutSwitch2TripReal", |
|---|
| | | "ac2OutSwitch3TripReal", |
|---|
| | | "ac2OutSwitch4TripReal", |
|---|
| | | ], |
|---|
| | | key1: [ |
|---|
| | | "ac2OutSwitch1TripFake", |
|---|
| | | "ac2OutSwitch2TripFake", |
|---|
| | | "ac2OutSwitch3TripFake", |
|---|
| | | "ac2OutSwitch4TripFake", |
|---|
| | | ], |
|---|
| | | flag: [ |
|---|
| | | "ac2OutSwitch1TripSt", |
|---|
| | | "ac2OutSwitch2TripSt", |
|---|
| | | "ac2OutSwitch3TripSt", |
|---|
| | | "ac2OutSwitch4TripSt", |
|---|
| | | ], |
|---|
| | | childrenCount: 100, |
|---|
| | | tip: "2段交流母线输出开关N跳闸", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流配电柜总告警", |
|---|
| | | key0: "acCabinetTatalAlmReal", |
|---|
| | | key1: "acCabinetTatalAlmFake", |
|---|
| | | flag: "acCabinetTatalAlmSt", |
|---|
| | | tip: "任一交流配电柜相关告警产生", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流配电柜温度告警", |
|---|
| | | key0: "acCabinetTempAlmReal", |
|---|
| | | key1: "acCabinetTempAlmFake", |
|---|
| | | flag: "acCabinetTempAlmSt", |
|---|
| | | tip: "交流配电柜环境温度高于告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "直流配电柜温度告警", |
|---|
| | | key0: "dcCabinetTempAlmReal", |
|---|
| | | key1: "dcCabinetTempAlmFake", |
|---|
| | | flag: "dcCabinetTempAlmSt", |
|---|
| | | tip: "直流配电柜环境温度高于告警点", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路直流过压", |
|---|
| | | key0: "dc1OverVolReal", |
|---|
| | | key1: "dc1OverVolFake", |
|---|
| | | flag: "dc1OverVolSt", |
|---|
| | | tip: "直流输出电压大于直流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路直流欠压", |
|---|
| | | key0: "dc1UnderVolReal", |
|---|
| | | key1: "dc1UnderVolFake", |
|---|
| | | flag: "dc1UnderVolSt", |
|---|
| | | tip: "直流输出电压小于直流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路直流过压", |
|---|
| | | key0: "dc2OverVolReal", |
|---|
| | | key1: "dc2OverVolFake", |
|---|
| | | flag: "dc2OverVolSt", |
|---|
| | | tip: "直流输出电压大于直流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路直流欠压", |
|---|
| | | key0: "dc2UnderVolReal", |
|---|
| | | key1: "dc2UnderVolFake", |
|---|
| | | flag: "dc2UnderVolSt", |
|---|
| | | tip: "直流输出电压小于直流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路直流输入开关跳闸", |
|---|
| | | key0: "dcIn1SwitchTripReal", |
|---|
| | | key1: "dcIn1SwitchTripFake", |
|---|
| | | flag: "dcIn1SwitchTripSt", |
|---|
| | | tip: "第1路直流输入开关跳闸", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路直流输入开关跳闸", |
|---|
| | | key0: "dcIn2SwitchTripReal", |
|---|
| | | key1: "dcIn2SwitchTripFake", |
|---|
| | | flag: "dcIn2SwitchTripSt", |
|---|
| | | tip: "第2路直流输入开关跳闸", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "1段直流第N路开关跳闸", |
|---|
| | | key0: [ |
|---|
| | | "dc1Switch1TripReal", |
|---|
| | | "dc1Switch2TripReal", |
|---|
| | | "dc1Switch3TripReal", |
|---|
| | | "dc1Switch4TripReal", |
|---|
| | | ], |
|---|
| | | key1: [ |
|---|
| | | "dc1Switch1TripFake", |
|---|
| | | "dc1Switch2TripFake", |
|---|
| | | "dc1Switch3TripFake", |
|---|
| | | "dc1Switch4TripFake", |
|---|
| | | ], |
|---|
| | | flag: [ |
|---|
| | | "dc1Switch1TripSt", |
|---|
| | | "dc1Switch2TripSt", |
|---|
| | | "dc1Switch3TripSt", |
|---|
| | | "dc1Switch4TripSt", |
|---|
| | | ], |
|---|
| | | childrenCount: 100, |
|---|
| | | tip: "第N路开关跳闸状态", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "2段直流第N路开关跳闸", |
|---|
| | | key0: [ |
|---|
| | | "dc2Switch1TripReal", |
|---|
| | | "dc2Switch2TripReal", |
|---|
| | | "dc2Switch3TripReal", |
|---|
| | | "dc2Switch4TripReal", |
|---|
| | | ], |
|---|
| | | key1: [ |
|---|
| | | "dc2Switch1TripFake", |
|---|
| | | "dc2Switch2TripFake", |
|---|
| | | "dc2Switch3TripFake", |
|---|
| | | "dc2Switch4TripFake", |
|---|
| | | ], |
|---|
| | | flag: [ |
|---|
| | | "dc2Switch1TripSt", |
|---|
| | | "dc2Switch2TripSt", |
|---|
| | | "dc2Switch3TripSt", |
|---|
| | | "dc2Switch4TripSt", |
|---|
| | | ], |
|---|
| | | childrenCount: 100, |
|---|
| | | tip: "第N路开关跳闸状态", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "直流监控单元故障", |
|---|
| | | key0: "monitorErrReal", |
|---|
| | | key1: "monitorErrFake", |
|---|
| | | flag: "monitorErrSt", |
|---|
| | | tip: "直流监控单元故障", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "直流配电柜总告警", |
|---|
| | | key0: "dcCabinetTatalAlmReal", |
|---|
| | | key1: "dcCabinetTatalAlmFake", |
|---|
| | | flag: "dcCabinetTatalAlmSt", |
|---|
| | | tip: "直流配电柜任一告警", |
|---|
| | | }, |
|---|
| | | ]; |
|---|
| | | const props2 = [ |
|---|
| | | { |
|---|
| | | label: "模块N开关机状态", |
|---|
| | | key0: ["m1Off1Real", "m1Off2Real"], |
|---|
| | | key1: ["m1Off1Fake", "m1Off2Fake"], |
|---|
| | | flag: ["m1Off1St", "m1Off2St"], |
|---|
| | | childrenCount: 32, |
|---|
| | | tip: "N模块开/关机状态", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块N故障", |
|---|
| | | key0: ["m1Err1Real", "m1Err2Real"], |
|---|
| | | key1: ["m1Err1Fake", "m1Err2Fake"], |
|---|
| | | flag: ["m1Err1St", "m1Err2St"], |
|---|
| | | childrenCount: 32, |
|---|
| | | tip: "N模块故障状态", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "高频开关电源柜总告警", |
|---|
| | | key0: "highFrqCabinetTotalAlmReal", |
|---|
| | | key1: "highFrqCabinetTotalAlmFake", |
|---|
| | | flag: "highFrqCabinetTotalAlmSt", |
|---|
| | | tip: "任一高频开关电源柜相关告警产生", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "直流输出过压", |
|---|
| | | key0: "dcOutOverVolReal", |
|---|
| | | key1: "dcOutOverVolFake", |
|---|
| | | flag: "dcOutOverVolSt", |
|---|
| | | tip: "直流输出电压大于直流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "直流输出欠压", |
|---|
| | | key0: "dcOutUnderVolReal", |
|---|
| | | key1: "dcOutUnderVolFake", |
|---|
| | | flag: "dcOutUnderVolSt", |
|---|
| | | tip: "直流输出电压小于直流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "电池组下电保护告警", |
|---|
| | | key0: "battOffProtectAlmReal", |
|---|
| | | key1: "battOffProtectAlmFake", |
|---|
| | | flag: "battOffProtectAlmSt", |
|---|
| | | tip: "电池组电压过低,自动保护脱离系统", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "电池组熔丝告警", |
|---|
| | | key0: "batt1FuseAlmReal", |
|---|
| | | key1: "batt1FuseAlmFake", |
|---|
| | | flag: "batt1FuseAlmSt", |
|---|
| | | tip: "电池组熔丝状态", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "负载熔丝状态", |
|---|
| | | key0: "loadFuseStateReal", |
|---|
| | | key1: "loadFuseStateFake", |
|---|
| | | flag: "loadFuseStateSt", |
|---|
| | | tip: "供直流配电柜的负载熔丝状态", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "均浮充状态", |
|---|
| | | key0: "junFloatStateReal", |
|---|
| | | key1: "junFloatStateFake", |
|---|
| | | flag: "junFloatStateSt", |
|---|
| | | tip: "高频开关电源柜处于均充/浮充", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流输入1停电", |
|---|
| | | key0: "ac1InPowerDownReal", |
|---|
| | | key1: "ac1InPowerDownFake", |
|---|
| | | flag: "ac1InPowerDownSt", |
|---|
| | | tip: "交流1输入三相电压均小于告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流输入2停电", |
|---|
| | | key0: "ac2InPowerDownReal", |
|---|
| | | key1: "ac2InPowerDownFake", |
|---|
| | | flag: "ac2InPowerDownSt", |
|---|
| | | tip: "交流2输入三相电压均小于告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流输入1防雷器故障", |
|---|
| | | key0: "ac1InThunderErrReal", |
|---|
| | | key1: "ac1InThunderErrFake", |
|---|
| | | flag: "ac1InThunderErrSt", |
|---|
| | | tip: "防雷电路故障", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流输入2防雷器故障", |
|---|
| | | key0: "ac2InThunderErrReal", |
|---|
| | | key1: "ac2InThunderErrFake", |
|---|
| | | flag: "ac2InThunderErrSt", |
|---|
| | | tip: "防雷电路故障", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流输入开关跳闸", |
|---|
| | | key0: "ac1InSwitchTripReal", |
|---|
| | | key1: "ac1InSwitchTripFake", |
|---|
| | | flag: "ac1InSwitchTripSt", |
|---|
| | | tip: "第1路交流输入空开跳闸", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流输入开关跳闸", |
|---|
| | | key0: "ac2InSwitchTripReal", |
|---|
| | | key1: "ac2InSwitchTripFake", |
|---|
| | | flag: "ac2InSwitchTripSt", |
|---|
| | | tip: "第2路交流输入空开跳闸", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流A相过压", |
|---|
| | | key0: "ac1OverVolAReal", |
|---|
| | | key1: "ac1OverVolAFake", |
|---|
| | | flag: "ac1OverVolASt", |
|---|
| | | tip: "第1路交流A相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流A相欠压", |
|---|
| | | key0: "ac1UnderVolAReal", |
|---|
| | | key1: "ac1UnderVolAFake", |
|---|
| | | flag: "ac1UnderVolASt", |
|---|
| | | tip: "第1路交流A相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流B相过压", |
|---|
| | | key0: "ac1OverVolBReal", |
|---|
| | | key1: "ac1OverVolBFake", |
|---|
| | | flag: "ac1OverVolBSt", |
|---|
| | | tip: "第1路交流B相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流B相欠压", |
|---|
| | | key0: "ac1UnderVolBReal", |
|---|
| | | key1: "ac1UnderVolBFake", |
|---|
| | | flag: "ac1UnderVolBSt", |
|---|
| | | tip: "第1路交流B相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流C相过压", |
|---|
| | | key0: "ac1OverVolCReal", |
|---|
| | | key1: "ac1OverVolCFake", |
|---|
| | | flag: "ac1OverVolCSt", |
|---|
| | | tip: "第1路交流C相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流C相欠压", |
|---|
| | | key0: "ac1UnderVolCReal", |
|---|
| | | key1: "ac1UnderVolCFake", |
|---|
| | | flag: "ac1UnderVolCSt", |
|---|
| | | tip: "第1路交流C相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流A相过压", |
|---|
| | | key0: "ac2OverVolAReal", |
|---|
| | | key1: "ac2OverVolAFake", |
|---|
| | | flag: "ac2OverVolASt", |
|---|
| | | tip: "第2路交流A相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流A相欠压", |
|---|
| | | key0: "ac2UnderVolAReal", |
|---|
| | | key1: "ac2UnderVolAFake", |
|---|
| | | flag: "ac2UnderVolASt", |
|---|
| | | tip: "第2路交流A相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流B相过压", |
|---|
| | | key0: "ac2OverVolBReal", |
|---|
| | | key1: "ac2OverVolBFake", |
|---|
| | | flag: "ac2OverVolBSt", |
|---|
| | | tip: "第2路交流B相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流B相欠压", |
|---|
| | | key0: "ac2UnderVolBReal", |
|---|
| | | key1: "ac2UnderVolBFake", |
|---|
| | | flag: "ac2UnderVolBSt", |
|---|
| | | tip: "第2路交流B相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流C相过压", |
|---|
| | | key0: "ac2OverVolCReal", |
|---|
| | | key1: "ac2OverVolCFake", |
|---|
| | | flag: "ac2OverVolCSt", |
|---|
| | | tip: "第2路交流C相输入电压大于交流过压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流C相欠压", |
|---|
| | | key0: "ac2UnderVolCReal", |
|---|
| | | key1: "ac2UnderVolCFake", |
|---|
| | | flag: "ac2UnderVolCSt", |
|---|
| | | tip: "第2路交流C相输入电压小于交流欠压告警值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流A相缺相", |
|---|
| | | key0: "ac1LessVolAReal", |
|---|
| | | key1: "ac1LessVolAFake", |
|---|
| | | flag: "ac1LessVolASt", |
|---|
| | | tip: "第1路交流A相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流B相缺相", |
|---|
| | | key0: "ac1LessVolBReal", |
|---|
| | | key1: "ac1LessVolBFake", |
|---|
| | | flag: "ac1LessVolBSt", |
|---|
| | | tip: "第1路交流B相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流C相缺相", |
|---|
| | | key0: "ac1LessVolCReal", |
|---|
| | | key1: "ac1LessVolCFake", |
|---|
| | | flag: "ac1LessVolCSt", |
|---|
| | | tip: "第1路交流C相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流A相缺相", |
|---|
| | | key0: "ac2LessVolAReal", |
|---|
| | | key1: "ac2LessVolAFake", |
|---|
| | | flag: "ac2LessVolASt", |
|---|
| | | tip: "第2路交流A相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流B相缺相", |
|---|
| | | key0: "ac2LessVolBReal", |
|---|
| | | key1: "ac2LessVolBFake", |
|---|
| | | flag: "ac2LessVolBSt", |
|---|
| | | tip: "第2路交流B相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流C相缺相", |
|---|
| | | key0: "ac2LessVolCReal", |
|---|
| | | key1: "ac2LessVolCFake", |
|---|
| | | flag: "ac2LessVolCSt", |
|---|
| | | tip: "第2路交流C相电压低于告警阈值", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "高频监控单元故障", |
|---|
| | | key0: "gpMonitorErrReal", |
|---|
| | | key1: "gpMonitorErrFake", |
|---|
| | | flag: "gpMonitorErrSt", |
|---|
| | | tip: "监控单元硬件故障,或者采集交流/直流数据失败", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "在用交流输入路数", |
|---|
| | | key0: "acInUseCountReal", |
|---|
| | | key1: "acInUseCountFake", |
|---|
| | | flag: "acInUseCountSt", |
|---|
| | | tip: "系统主用交流", |
|---|
| | | }, |
|---|
| | | ]; |
|---|
| | | |
|---|
| | | const param_acdc = [ |
|---|
| | | { |
|---|
| | | label: "第1路交流A相输入电压", |
|---|
| | | key0: "acIn1VolAReal", |
|---|
| | | key1: "acIn1VolAFake", |
|---|
| | | flag: "acIn1VolASt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流B相输入电压", |
|---|
| | | key0: "acIn1VolBReal", |
|---|
| | | key1: "acIn1VolBFake", |
|---|
| | | flag: "acIn1VolBSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流C相输入电压", |
|---|
| | | key0: "acIn1VolCReal", |
|---|
| | | key1: "acIn1VolCFake", |
|---|
| | | flag: "acIn1VolCSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流A相输入电流", |
|---|
| | | key0: "acIn1CurrAReal", |
|---|
| | | key1: "acIn1CurrAFake", |
|---|
| | | flag: "acIn1CurrASt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流B相输入电流", |
|---|
| | | key0: "acIn1CurrBReal", |
|---|
| | | key1: "acIn1CurrBFake", |
|---|
| | | flag: "acIn1CurrBSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流C相输入电流", |
|---|
| | | key0: "acIn1CurrCReal", |
|---|
| | | key1: "acIn1CurrCFake", |
|---|
| | | flag: "acIn1CurrCSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流A相输入电压", |
|---|
| | | key0: "acIn2VolAReal", |
|---|
| | | key1: "acIn2VolAFake", |
|---|
| | | flag: "acIn2VolASt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流B相输入电压", |
|---|
| | | key0: "acIn2VolBReal", |
|---|
| | | key1: "acIn2VolBFake", |
|---|
| | | flag: "acIn2VolBSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流C相输入电压", |
|---|
| | | key0: "acIn2VolCReal", |
|---|
| | | key1: "acIn2VolCFake", |
|---|
| | | flag: "acIn2VolCSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流A相输入电流", |
|---|
| | | key0: "acIn2CurrAReal", |
|---|
| | | key1: "acIn2CurrAFake", |
|---|
| | | flag: "acIn2CurrASt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流B相输入电流", |
|---|
| | | key0: "acIn2CurrBReal", |
|---|
| | | key1: "acIn2CurrBFake", |
|---|
| | | flag: "acIn2CurrBSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流C相输入电流", |
|---|
| | | key0: "acIn2CurrCReal", |
|---|
| | | key1: "acIn2CurrCFake", |
|---|
| | | flag: "acIn2CurrCSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流配电柜温度", |
|---|
| | | key0: "acCabinetTempReal", |
|---|
| | | key1: "acCabinetTempFake", |
|---|
| | | flag: "acCabinetTempSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "直流配电柜温度", |
|---|
| | | key0: "dcCabinetTempReal", |
|---|
| | | key1: "dcCabinetTempFake", |
|---|
| | | flag: "dcCabinetTempSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路直流输入电压", |
|---|
| | | key0: "dcIn1VolReal", |
|---|
| | | key1: "dcIn1VolFake", |
|---|
| | | flag: "dcIn1VolSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路直流输入电压", |
|---|
| | | key0: "dcIn2VolReal", |
|---|
| | | key1: "dcIn2VolFake", |
|---|
| | | flag: "dcIn2VolSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "1段直流母线输出电压", |
|---|
| | | key0: "dcOut1VolReal", |
|---|
| | | key1: "dcOut1VolFake", |
|---|
| | | flag: "dcOut1VolSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "2段直流母线输出电压", |
|---|
| | | key0: "dcOut2VolReal", |
|---|
| | | key1: "dcOut2VolFake", |
|---|
| | | flag: "dcOut2VolSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "1段直流母线输出电流", |
|---|
| | | key0: "dcOut1CurrReal", |
|---|
| | | key1: "dcOut1CurrFake", |
|---|
| | | flag: "dcOut1CurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "2段直流母线输出电流", |
|---|
| | | key0: "dcOut2CurrReal", |
|---|
| | | key1: "dcOut2CurrFake", |
|---|
| | | flag: "dcOut2CurrSt", |
|---|
| | | }, |
|---|
| | | ]; |
|---|
| | | |
|---|
| | | const param_gp = [ |
|---|
| | | { |
|---|
| | | label: "高频开关配电柜温度", |
|---|
| | | key0: "highFrqCabinetTempReal", |
|---|
| | | key1: "highFrqCabinetTempFake", |
|---|
| | | flag: "highFrqCabinetTempSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流A相输出电压", |
|---|
| | | key0: "acOutVolAReal", |
|---|
| | | key1: "acOutVolAFake", |
|---|
| | | flag: "acOutVolASt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流B相输出电压", |
|---|
| | | key0: "acOutVolBReal", |
|---|
| | | key1: "acOutVolBFake", |
|---|
| | | flag: "acOutVolBSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流C相输出电压", |
|---|
| | | key0: "acOutVolCReal", |
|---|
| | | key1: "acOutVolCFake", |
|---|
| | | flag: "acOutVolCSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流A相输出电流", |
|---|
| | | key0: "acOutCurrAReal", |
|---|
| | | key1: "acOutCurrAFake", |
|---|
| | | flag: "acOutCurrASt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流B相输出电流", |
|---|
| | | key0: "acOutCurrBReal", |
|---|
| | | key1: "acOutCurrBFake", |
|---|
| | | flag: "acOutCurrBSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "交流C相输出电流", |
|---|
| | | key0: "acOutCurrCReal", |
|---|
| | | key1: "acOutCurrCFake", |
|---|
| | | flag: "acOutCurrCSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "直流输出电压", |
|---|
| | | key0: "dcOutVolReal", |
|---|
| | | key1: "dcOutVolFake", |
|---|
| | | flag: "dcOutVolSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "负载电流", |
|---|
| | | key0: "loadCurrReal", |
|---|
| | | key1: "loadCurrFake", |
|---|
| | | flag: "loadCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "蓄电池组充电电流", |
|---|
| | | key0: "battCharCurrReal", |
|---|
| | | key1: "battCharCurrFake", |
|---|
| | | flag: "battCharCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "电池组端电压", |
|---|
| | | key0: "batt1GroupVolReal", |
|---|
| | | key1: "batt1GroupVolFake", |
|---|
| | | flag: "batt1GroupVolSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块1输出电流", |
|---|
| | | key0: "m1OutCurrReal", |
|---|
| | | key1: "m1OutCurrFake", |
|---|
| | | flag: "m1OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块2输出电流", |
|---|
| | | key0: "m2OutCurrReal", |
|---|
| | | key1: "m2OutCurrFake", |
|---|
| | | flag: "m2OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块3输出电流", |
|---|
| | | key0: "m3OutCurrReal", |
|---|
| | | key1: "m3OutCurrFake", |
|---|
| | | flag: "m3OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块4输出电流", |
|---|
| | | key0: "m4OutCurrReal", |
|---|
| | | key1: "m4OutCurrFake", |
|---|
| | | flag: "m4OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块5输出电流", |
|---|
| | | key0: "m5OutCurrReal", |
|---|
| | | key1: "m5OutCurrFake", |
|---|
| | | flag: "m5OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块6输出电流", |
|---|
| | | key0: "m6OutCurrReal", |
|---|
| | | key1: "m6OutCurrFake", |
|---|
| | | flag: "m6OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块7输出电流", |
|---|
| | | key0: "m7OutCurrReal", |
|---|
| | | key1: "m7OutCurrFake", |
|---|
| | | flag: "m7OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块8输出电流", |
|---|
| | | key0: "m8OutCurrReal", |
|---|
| | | key1: "m8OutCurrFake", |
|---|
| | | flag: "m8OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块9输出电流", |
|---|
| | | key0: "m9OutCurrReal", |
|---|
| | | key1: "m9OutCurrFake", |
|---|
| | | flag: "m9OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块10输出电流", |
|---|
| | | key0: "m10OutCurrReal", |
|---|
| | | key1: "m10OutCurrFake", |
|---|
| | | flag: "m10OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块11输出电流", |
|---|
| | | key0: "m11OutCurrReal", |
|---|
| | | key1: "m11OutCurrFake", |
|---|
| | | flag: "m11OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块12输出电流", |
|---|
| | | key0: "m12OutCurrReal", |
|---|
| | | key1: "m12OutCurrFake", |
|---|
| | | flag: "m12OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块13输出电流", |
|---|
| | | key0: "m13OutCurrReal", |
|---|
| | | key1: "m13OutCurrFake", |
|---|
| | | flag: "m13OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块14输出电流", |
|---|
| | | key0: "m14OutCurrReal", |
|---|
| | | key1: "m14OutCurrFake", |
|---|
| | | flag: "m14OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块15输出电流", |
|---|
| | | key0: "m15OutCurrReal", |
|---|
| | | key1: "m15OutCurrFake", |
|---|
| | | flag: "m15OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块16输出电流", |
|---|
| | | key0: "m16OutCurrReal", |
|---|
| | | key1: "m16OutCurrFake", |
|---|
| | | flag: "m16OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块17输出电流", |
|---|
| | | key0: "m17OutCurrReal", |
|---|
| | | key1: "m17OutCurrFake", |
|---|
| | | flag: "m17OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块18输出电流", |
|---|
| | | key0: "m18OutCurrReal", |
|---|
| | | key1: "m18OutCurrFake", |
|---|
| | | flag: "m18OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块19输出电流", |
|---|
| | | key0: "m19OutCurrReal", |
|---|
| | | key1: "m19OutCurrFake", |
|---|
| | | flag: "m19OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块20输出电流", |
|---|
| | | key0: "m20OutCurrReal", |
|---|
| | | key1: "m20OutCurrFake", |
|---|
| | | flag: "m20OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块21输出电流", |
|---|
| | | key0: "m21OutCurrReal", |
|---|
| | | key1: "m21OutCurrFake", |
|---|
| | | flag: "m21OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块22输出电流", |
|---|
| | | key0: "m22OutCurrReal", |
|---|
| | | key1: "m22OutCurrFake", |
|---|
| | | flag: "m22OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块23输出电流", |
|---|
| | | key0: "m23OutCurrReal", |
|---|
| | | key1: "m23OutCurrFake", |
|---|
| | | flag: "m23OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块24输出电流", |
|---|
| | | key0: "m24OutCurrReal", |
|---|
| | | key1: "m24OutCurrFake", |
|---|
| | | flag: "m24OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块25输出电流", |
|---|
| | | key0: "m25OutCurrReal", |
|---|
| | | key1: "m25OutCurrFake", |
|---|
| | | flag: "m25OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块26输出电流", |
|---|
| | | key0: "m26OutCurrReal", |
|---|
| | | key1: "m26OutCurrFake", |
|---|
| | | flag: "m26OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块27输出电流", |
|---|
| | | key0: "m27OutCurrReal", |
|---|
| | | key1: "m27OutCurrFake", |
|---|
| | | flag: "m27OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块28输出电流", |
|---|
| | | key0: "m28OutCurrReal", |
|---|
| | | key1: "m28OutCurrFake", |
|---|
| | | flag: "m28OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块29输出电流", |
|---|
| | | key0: "m29OutCurrReal", |
|---|
| | | key1: "m29OutCurrFake", |
|---|
| | | flag: "m29OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块30输出电流", |
|---|
| | | key0: "m30OutCurrReal", |
|---|
| | | key1: "m30OutCurrFake", |
|---|
| | | flag: "m30OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块31输出电流", |
|---|
| | | key0: "m31OutCurrReal", |
|---|
| | | key1: "m31OutCurrFake", |
|---|
| | | flag: "m31OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "模块32输出电流", |
|---|
| | | key0: "m32OutCurrReal", |
|---|
| | | key1: "m32OutCurrFake", |
|---|
| | | flag: "m32OutCurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流A相输入电压", |
|---|
| | | key0: "ac1InVolAReal", |
|---|
| | | key1: "ac1InVolAFake", |
|---|
| | | flag: "ac1InVolASt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流B相输入电压", |
|---|
| | | key0: "ac1InVolBReal", |
|---|
| | | key1: "ac1InVolBFake", |
|---|
| | | flag: "ac1InVolBSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第1路交流C相输入电压", |
|---|
| | | key0: "ac1InVolCReal", |
|---|
| | | key1: "ac1InVolCFake", |
|---|
| | | flag: "ac1InVolCSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流A相输入电压", |
|---|
| | | key0: "ac2InVolAReal", |
|---|
| | | key1: "ac2InVolAFake", |
|---|
| | | flag: "ac2InVolASt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流B相输入电压", |
|---|
| | | key0: "ac2InVolBReal", |
|---|
| | | key1: "ac2InVolBFake", |
|---|
| | | flag: "ac2InVolBSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "第2路交流C相输入电压", |
|---|
| | | key0: "ac2InVolCReal", |
|---|
| | | key1: "ac2InVolCFake", |
|---|
| | | flag: "ac2InVolCSt", |
|---|
| | | }, |
|---|
| | | ]; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | props1, |
|---|
| | | props2, |
|---|
| | | param_acdc, |
|---|
| | | param_gp, |
|---|
| | | }; |
|---|
copy from src/views/testRecord/details.vue
copy to src/views/hrTestRecord/details.vue
| File was copied from src/views/testRecord/details.vue |
| | |
|---|
| | | <!-- 状态栏 --> |
|---|
| | | <div class="info flex-r"> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">断路器类型</div> |
|---|
| | | <div class="value">交流断路器</div> |
|---|
| | | <div class="label">设备名称</div> |
|---|
| | | <div class="value">交流配电柜</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">断路器名称</div> |
|---|
| | | <div class="value">DK11</div> |
|---|
| | | <div class="label">参数类型</div> |
|---|
| | | <div class="value">遥测量</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">动作总次数</div> |
|---|
| | | <div class="value">13</div> |
|---|
| | | <div class="label">参数名称</div> |
|---|
| | | <div class="value">第1路交流A相输入电压</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">动作日期</div> |
|---|
| | | <div class="label">模拟日期</div> |
|---|
| | | <div class="value">2023-12-08</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">第一次动作时间</div> |
|---|
| | | <div class="label">第一次模拟时间</div> |
|---|
| | | <div class="value">09:58:23</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">第一次动作</div> |
|---|
| | | <div class="label">第一次模拟数值</div> |
|---|
| | | <div class="value">合闸</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">最后一次动作时间</div> |
|---|
| | | <div class="label">最后一次模拟时间</div> |
|---|
| | | <div class="value">10:00:03</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">最后一次动作</div> |
|---|
| | | <div class="label">最后一次模拟数值</div> |
|---|
| | | <div class="value">分闸</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <div class="chart-contain flex-r"> |
|---|
| | | <div class="name-panel"> |
|---|
| | | <div class="row"> |
|---|
| | | <div class="">断路器名称</div> |
|---|
| | | <div class="switch-name">DK11</div> |
|---|
| | | <div class="">遥测量名称</div> |
|---|
| | | <div class="switch-name">第1路交流A相输入电压</div> |
|---|
| | | </div> |
|---|
| | | <div class="row"> |
|---|
| | | <div class="">合闸</div> |
|---|
| | | <div class="">模拟次数</div> |
|---|
| | | <div class="num">7</div> |
|---|
| | | </div> |
|---|
| | | <div class="row"> |
|---|
| | | <div class="">分闸</div> |
|---|
| | | <div class="num">6</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="chart-wrap"> |
|---|
| | | <step-line></step-line> |
|---|
| | | <bar unit="V"></bar> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <!-- 表格 --> |
|---|
| | | <panel class="panel p-content"> |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">动作类型</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="devType" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in devtypes" |
|---|
| | | :key="'type_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="idx" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">操作终端</div> |
|---|
| | | <div class="value"> |
|---|
| | |
|---|
| | | <script> |
|---|
| | | import Panel from "@/components/panel.vue"; |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | import stepLine from '@/components/stepLine'; |
|---|
| | | import bar from '@/components/bar'; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | |
|---|
| | | components: { |
|---|
| | | Panel, |
|---|
| | | gradientBtn, |
|---|
| | | stepLine, |
|---|
| | | bar, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "devName", |
|---|
| | | label: "断路器位置", |
|---|
| | | label: "模拟时间", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almName", |
|---|
| | | label: "断路器名称", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | | label: "测控日期", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almStartTime", |
|---|
| | | label: "动作总次数", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almConfirmedTime", |
|---|
| | | label: "合闸次数", |
|---|
| | | label: "模拟值", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almIsConfirmed", |
|---|
| | | label: "分闸次数", |
|---|
| | | label: "操作终端", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: {}, |
|---|
| | | methods: { |
|---|
| | | getList(){ |
|---|
| | | |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() {}, |
|---|
| | | }; |
|---|
| | |
|---|
| | | } |
|---|
| | | .chart-contain { |
|---|
| | | margin-top: 8px; |
|---|
| | | height: 300px; |
|---|
| | | height: 220px; |
|---|
| | | .name-panel { |
|---|
| | | background: #00253f; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | justify-content: space-around; |
|---|
| | | align-items: center; |
|---|
| | | width: 180px; |
|---|
| | | padding: 10px; |
|---|
| | | margin-right: 10px; |
|---|
| | | .row { |
|---|
| | |
|---|
| | | color: #78EEF8; |
|---|
| | | font-size: 24px; |
|---|
| | | font-weight: 700; |
|---|
| | | text-align: center; |
|---|
| | | } |
|---|
| | | .num { |
|---|
| | | color: #78eef8; |
|---|
| | |
|---|
| | | } |
|---|
| | | .search { |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-around; |
|---|
| | | justify-content: space-between; |
|---|
| | | .s-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| File was renamed from src/views/testRecord/index.vue |
| | |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测控线路</div> |
|---|
| | | <div class="label">设备名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="devType" |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">断路器名称</div> |
|---|
| | | <div class="label">参数类型</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="almLevel" |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测控日期</div> |
|---|
| | | <div class="label">参数名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="almLevel" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in almLevels" |
|---|
| | | :key="'level_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="idx" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测试日期</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-date-picker |
|---|
| | | v-model="date1" |
|---|
| | |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "devName", |
|---|
| | | label: "断路器位置", |
|---|
| | | label: "设备名称", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almName", |
|---|
| | | label: "断路器名称", |
|---|
| | | label: "参数类型", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | | label: "参数名称", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almStartTime", |
|---|
| | | label: "动作总次数", |
|---|
| | | label: "测控次数", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almConfirmedTime", |
|---|
| | | label: "合闸次数", |
|---|
| | | label: "最后一次测控时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almIsConfirmed", |
|---|
| | | label: "分闸次数", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | datas: [ |
|---|
| | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | details() { |
|---|
| | | this.$router.push("/test-record/details"); |
|---|
| | | this.$router.push("/data-record/power-details"); |
|---|
| | | }, |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { |
|---|
| | |
|---|
| | | min-height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | // background: url('images/bg.jpg') center center / 100% 100% no-repeat; |
|---|
| | | background: url("images/bg.jpg") center center / cover no-repeat; |
|---|
| | | background: url("./images/bg.jpg") center center / cover no-repeat; |
|---|
| | | // background-color: #2d3a4b; |
|---|
| | | overflow: hidden; |
|---|
| | | |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class="p-main flex-c"> |
|---|
| | | <panel class="panel p-content"> |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">操作人</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select v-model="userName" class="dark" filterable size="mini" @change="getList" placeholder="请选择"> |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option v-for="(item, idx) in userList" :key="'type_' + idx" :label="item" :value="item"> |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">事件类型</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select v-model="type2" class="dark" filterable size="mini" @change="getList" placeholder="请选择"> |
|---|
| | | <el-option label="全部" value=""></el-option> |
|---|
| | | <el-option v-for="(item, idx) in operateTypes" :key="'level_' + idx" :label="item.type2Name" :value="item.type2"> |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">操作记录时间段</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-date-picker v-model="startTime" size="mini" class="time_box dark" type="date" placeholder="选择日期" |
|---|
| | | @change="getList" value-format="yyyy-MM-dd"></el-date-picker>- |
|---|
| | | <el-date-picker v-model="endTime" size="mini" class="time_box dark" type="date" placeholder="选择日期" |
|---|
| | | @change="getList" value-format="yyyy-MM-dd"></el-date-picker> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <gradient-btn size="sm" @click="getList">查询</gradient-btn> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="table-wrap"> |
|---|
| | | <el-table id="batteryrTimequeryTable" stripe size="small" :data="table.datas" height="100%" class="table-dark" |
|---|
| | | tooltip-effect="light"> |
|---|
| | | <el-table-column label="序号" type="index" width="80"></el-table-column> |
|---|
| | | <el-table-column v-for="header in table.headers" :key="header.prop" :prop="header.prop" :label="header.label" |
|---|
| | | :width="header.width" :min-width="header.minWidth" show-overflow-tooltip align="center"></el-table-column> |
|---|
| | | <!-- <el-table-column |
|---|
| | | prop="cztime" |
|---|
| | | fixed="right" |
|---|
| | | width="240px" |
|---|
| | | align="center" |
|---|
| | | label="操作" |
|---|
| | | > |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-button |
|---|
| | | class="yellow" |
|---|
| | | size="mini" |
|---|
| | | @click="details(scope.row)" |
|---|
| | | >详情</el-button |
|---|
| | | > |
|---|
| | | </template> |
|---|
| | | </el-table-column> --> |
|---|
| | | </el-table> |
|---|
| | | </div> |
|---|
| | | <!-- 底部分页 --> |
|---|
| | | <el-pagination class="pages center dark" :current-page="pageNum" @size-change="handleSizeChange" |
|---|
| | | @current-change="handleCurrentChange" :page-sizes="[10, 20, 30, 50, 100]" :page-size="pageSize" |
|---|
| | | layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination> |
|---|
| | | </div> |
|---|
| | | </panel> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import Panel from "@/components/panel.vue"; |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | |
|---|
| | | import createWs from "@/assets/js/websocket/plus"; |
|---|
| | | const WSMixin = createWs("ckPowerDevAlarmHisCount"); |
|---|
| | | |
|---|
| | | import { getTypes, getUserNameList, getList } from "./js/apis"; |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | |
|---|
| | | mixins: [WSMixin], |
|---|
| | | components: { |
|---|
| | | Panel, |
|---|
| | | gradientBtn, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | userList: [], |
|---|
| | | operateTypes: [], |
|---|
| | | almCount: {}, |
|---|
| | | type2: '', |
|---|
| | | userName: '', |
|---|
| | | pageNum: 1, |
|---|
| | | pageSize: 10, |
|---|
| | | devType: 0, |
|---|
| | | almLevel: 0, |
|---|
| | | startTime: "", |
|---|
| | | endTime: "", |
|---|
| | | total: 0, |
|---|
| | | table: { |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "userName", |
|---|
| | | label: "操作人", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "type2Name", |
|---|
| | | label: "操作类型", |
|---|
| | | width: 260, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "createTime", |
|---|
| | | label: "操作时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "detail", |
|---|
| | | label: "操作事件", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | datas: [ |
|---|
| | | { |
|---|
| | | devName: 1, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | getList() { |
|---|
| | | let params = { |
|---|
| | | pageNum: this.pageNum, |
|---|
| | | pageSize: this.pageSize, |
|---|
| | | startTime: this.startTime ? this.startTime + ' 00:00:00' : undefined, |
|---|
| | | endTime: this.endTime ? this.endTime + ' 23:59:59' : undefined, |
|---|
| | | userName: this.userName || undefined, |
|---|
| | | type2: this.type2 || undefined, |
|---|
| | | }; |
|---|
| | | console.log("=====9=", params, JSON.stringify(params)); |
|---|
| | | // this.SOCKET1.send(JSON.stringify(params)); |
|---|
| | | getList(params) |
|---|
| | | .then((res) => { |
|---|
| | | let { |
|---|
| | | code, |
|---|
| | | data: { list, total }, |
|---|
| | | } = res.data; |
|---|
| | | let list1 = []; |
|---|
| | | let total1 = 0; |
|---|
| | | if (code) { |
|---|
| | | list1 = list.map((v) => { |
|---|
| | | v.devName = ["", "交流配电柜", "直流配电柜", "高频开关电源柜"][ |
|---|
| | | v.devType |
|---|
| | | ]; |
|---|
| | | v.almLevelStr = ["", "一般", "重大", "紧急"][v.almLevel]; |
|---|
| | | return v; |
|---|
| | | }); |
|---|
| | | total1 = total; |
|---|
| | | } |
|---|
| | | this.table.datas = list1; |
|---|
| | | this.total = total1; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | // 展示数据数量 |
|---|
| | | handleSizeChange(val) { |
|---|
| | | this.pageSize = val; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | // 翻页 |
|---|
| | | handleCurrentChange(val) { |
|---|
| | | this.pageNum = val; |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | getTypes() { |
|---|
| | | getTypes().then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | console.log(data); |
|---|
| | | Object.values(data).forEach((v) => { |
|---|
| | | list.push(...v); |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | this.operateTypes = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | getUserNameList() { |
|---|
| | | getUserNameList().then((res) => { |
|---|
| | | let list = []; |
|---|
| | | let { code, data } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | list = data; |
|---|
| | | } |
|---|
| | | this.userList = list; |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() { |
|---|
| | | this.getTypes(); |
|---|
| | | this.getUserNameList(); |
|---|
| | | this.getList(); |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .p-main { |
|---|
| | | height: 100%; |
|---|
| | | |
|---|
| | | .btn-grp { |
|---|
| | | .btn-alarm { |
|---|
| | | width: 160px; |
|---|
| | | height: 30px; |
|---|
| | | color: #fff; |
|---|
| | | font-size: 18px; |
|---|
| | | font-weight: bold; |
|---|
| | | padding: 0 6px; |
|---|
| | | border: 0 none; |
|---|
| | | |
|---|
| | | /deep/ span { |
|---|
| | | display: flex; |
|---|
| | | color: inherit; |
|---|
| | | justify-content: space-between; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | background: #fff; |
|---|
| | | border-radius: 4px; |
|---|
| | | padding: 2px 16px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.levelall { |
|---|
| | | background: #78eef8; |
|---|
| | | |
|---|
| | | color: #011f39; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | background: #011f39; |
|---|
| | | color: #78eef8; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level0 { |
|---|
| | | background: #ff3801; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #ff3801; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level1 { |
|---|
| | | background: #f69f40; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #f69f40; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.level2 { |
|---|
| | | background: #4871e3; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | color: #4871e3; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.type { |
|---|
| | | background: #4871e3; |
|---|
| | | width: auto; |
|---|
| | | |
|---|
| | | .num { |
|---|
| | | margin-left: 1em; |
|---|
| | | color: #4871e3; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .p-content { |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 4px; |
|---|
| | | |
|---|
| | | /deep/ .content { |
|---|
| | | background: #011f39; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .panel-content { |
|---|
| | | height: 100%; |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .search { |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | padding: 0 0.4em; |
|---|
| | | |
|---|
| | | .s-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .label { |
|---|
| | | color: #78eef8; |
|---|
| | | |
|---|
| | | &::after { |
|---|
| | | content: ":"; |
|---|
| | | } |
|---|
| | | |
|---|
| | | margin-right: 0.4em; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .table-wrap { |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 6px; |
|---|
| | | margin-bottom: 6px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/ .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { |
|---|
| | | background-color: #2155ff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | import axios from "axios"; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 查询 事件类型-查询 下拉 |
|---|
| | | */ |
|---|
| | | export const getTypes = () => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "operationLog/getTypes", |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 操作人姓名-查询-操作日志使用 下拉 |
|---|
| | | */ |
|---|
| | | export const getUserNameList = () => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "userInf/getUserNameList", |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 日志 分页 |
|---|
| | | */ |
|---|
| | | export const getList = (data) => { |
|---|
| | | return axios({ |
|---|
| | | method: "POST", |
|---|
| | | url: "operationLog/getPage", |
|---|
| | | data, |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | |
|---|
| | |
|---|
| | | .then(() => { |
|---|
| | | // console.log('调用结定接口', this.num, this.option.key1); |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | let params = {}; |
|---|
| | | let params = { logList: [] }; |
|---|
| | | params[this.option.key1] = num; |
|---|
| | | params[this.option.flag] = flag; |
|---|
| | | params["logList"].push({ |
|---|
| | | param: this.option.flag, |
|---|
| | | paramCn: this.title, |
|---|
| | | fake: num, |
|---|
| | | st: flag, |
|---|
| | | }); |
|---|
| | | updateYC(params) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data, msg } = res.data; |
|---|
| | |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </style> |
|---|
| | |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | let params = {}; |
|---|
| | | let params = { logList: [] }; |
|---|
| | | let { key1, flag, childrenCount, index } = this.option; |
|---|
| | | if (childrenCount) { |
|---|
| | | // 需要处理同一个字段的值 |
|---|
| | |
|---|
| | | let _flag = this.datas[prop_flag]; |
|---|
| | | // console.log(_key1, _flag, propIdx, index, '====idx', index % 25); |
|---|
| | | params[prop_key1] = setBitAtPositions(_key1, [index % 25], pflag); |
|---|
| | | params[prop_flag] = changeBinaryBits(_flag, [index % 25]); |
|---|
| | | // params[prop_flag] = changeBinaryBits(_flag, [index % 25]); |
|---|
| | | params[prop_flag] = setBitAtPositions(_flag, [index % 25], pflag); |
|---|
| | | params["logList"].push({ |
|---|
| | | param: prop_flag + "_" + (index % 25), |
|---|
| | | paramCn: this.title, |
|---|
| | | fake: 1, |
|---|
| | | st: pflag1, |
|---|
| | | }); |
|---|
| | | } else { |
|---|
| | | params[key1] = 1; |
|---|
| | | params[flag] = pflag; |
|---|
| | | params["logList"].push({ |
|---|
| | | param: flag, |
|---|
| | | paramCn: this.title, |
|---|
| | | fake: 1, |
|---|
| | | st: pflag, |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | updateYX(params) |
|---|
| | | .then((res) => { |
|---|
| | |
|---|
| | | padding-left: 8px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </style> |
|---|
| | |
|---|
| | | </panel> |
|---|
| | | </div> |
|---|
| | | </el-tab-pane> |
|---|
| | | <el-tab-pane label="核容装置"> |
|---|
| | | <div class="tab-content content3 flex-r"> |
|---|
| | | <panel class="panel left" title="遥调量模拟"> |
|---|
| | | <div slot="tools" class="btn-grp"> |
|---|
| | | <gradient-btn size="xs">全选</gradient-btn> |
|---|
| | | <gradient-btn size="xs" :disabled="!hasPermission" |
|---|
| | | >批量设定</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | <div class="content"> |
|---|
| | | <div class="grid1"> |
|---|
| | | <yc-grid :count="6" :config="[1, 2, 3]"> |
|---|
| | | <template v-slot="{ data, index }"> |
|---|
| | | <card |
|---|
| | | :option="{}" |
|---|
| | | :checked.sync="checkList1_gp[index]" |
|---|
| | | :datas="rtData" |
|---|
| | | ></card> |
|---|
| | | </template> |
|---|
| | | </yc-grid> |
|---|
| | | </div> |
|---|
| | | <div class="grid1"> |
|---|
| | | <yc-grid :count="3" :cols="2" :config="ips"> |
|---|
| | | <template v-slot="{ data, index }"> |
|---|
| | | <ip-card |
|---|
| | | :ip.sync="data[index].ip" |
|---|
| | | @change="changeIp" |
|---|
| | | ></ip-card> |
|---|
| | | </template> |
|---|
| | | </yc-grid> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </panel> |
|---|
| | | <panel class="panel right" title="遥控量模拟"> |
|---|
| | | <div class="content"> |
|---|
| | | <el-row class="el_row" :gutter="20"> |
|---|
| | | <el-col class="el_col" :span="12"> |
|---|
| | | <div class="card3"> |
|---|
| | | <div class="card-title">蓄电池放电模拟</div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">蓄电池实时状态:</div> |
|---|
| | | <div class="value">浮充</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">蓄电池放电模拟:</div> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <gradient-btn size="sm" :disabled="!hasPermission" |
|---|
| | | >开始放电</gradient-btn |
|---|
| | | > |
|---|
| | | <gradient-btn |
|---|
| | | active |
|---|
| | | size="sm" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | >停止放电</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | <el-col class="el_col" :span="12"> |
|---|
| | | <div class="card3"> |
|---|
| | | <div class="card-title">蓄电池内阻模拟</div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">蓄电池实时状态:</div> |
|---|
| | | <div class="value">浮充</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">内阻测试模拟:</div> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <gradient-btn size="sm" :disabled="!hasPermission" |
|---|
| | | >启动内阻测试</gradient-btn |
|---|
| | | > |
|---|
| | | <gradient-btn |
|---|
| | | active |
|---|
| | | size="sm" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | >停止内阻测试</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | <el-col class="el_col" :span="12"> |
|---|
| | | <div class="card3"> |
|---|
| | | <div class="card-title">核容装置K1/D1测试模拟</div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置状态:</div> |
|---|
| | | <div class="value">浮充</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">K1/D1测试模拟:</div> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <gradient-btn size="sm" :disabled="!hasPermission" |
|---|
| | | >启动K1/D1测试</gradient-btn |
|---|
| | | > |
|---|
| | | <gradient-btn |
|---|
| | | active |
|---|
| | | size="sm" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | >停止K1/D1测试</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | <el-col class="el_col" :span="12"> |
|---|
| | | <div class="card3"> |
|---|
| | | <div class="card-title">蓄电池内阻模拟</div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置状态:</div> |
|---|
| | | <div class="value">浮充</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">装置重启模拟:</div> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <gradient-btn size="sm" :disabled="!hasPermission" |
|---|
| | | >重启核容装置</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | <el-col class="el_col" :span="12"> |
|---|
| | | <div class="card3"> |
|---|
| | | <div class="card-title">核容装置IP配置</div> |
|---|
| | | <div class="card-content"> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置IP地址:</div> |
|---|
| | | <div class="value">192.168.10.112</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置IP网关:</div> |
|---|
| | | <div class="value">192.168.10.1</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置子网掩码:</div> |
|---|
| | | <div class="value">255.255.255.0</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置配置IP地址:</div> |
|---|
| | | <div class="value">192.168.10.112</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置配置IP网关:</div> |
|---|
| | | <div class="value">192.168.10.1</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">核容装置配置子网掩码:</div> |
|---|
| | | <div class="value">255.255.255.0</div> |
|---|
| | | </div> |
|---|
| | | <div class="item-row"> |
|---|
| | | <div class="label">装置重启模拟:</div> |
|---|
| | | <div class="btn-grp"> |
|---|
| | | <gradient-btn size="sm" :disabled="!hasPermission" |
|---|
| | | >暂时配置生效</gradient-btn |
|---|
| | | > |
|---|
| | | <gradient-btn |
|---|
| | | active |
|---|
| | | size="sm" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | >永久配置生效</gradient-btn |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | </el-row> |
|---|
| | | </div> |
|---|
| | | </panel> |
|---|
| | | </div> |
|---|
| | | </el-tab-pane> |
|---|
| | | </el-tabs> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | |
|---|
| | | let idx = m + 1; |
|---|
| | | let mIdx = Math.floor(m / 25); |
|---|
| | | arr.push({ |
|---|
| | | label0: item.label, |
|---|
| | | label: item.label.replace("N", idx), |
|---|
| | | key0: item.key0, |
|---|
| | | key1: item.key1, |
|---|
| | |
|---|
| | | let idx = m + 1; |
|---|
| | | let mIdx = Math.floor(m / 25); |
|---|
| | | arr.push({ |
|---|
| | | label0: item.label, |
|---|
| | | label: item.label.replace("N", idx), |
|---|
| | | key0: item.key0, |
|---|
| | | key1: item.key1, |
|---|
| | |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | let params = {}; |
|---|
| | | let params = { logList: [] }; |
|---|
| | | let checkList = this["checkList1_" + type]; |
|---|
| | | checkList |
|---|
| | | .map((v, i) => ({ i, v })) |
|---|
| | |
|---|
| | | // console.log($el); |
|---|
| | | params[$el.option.key1] = $el.num; |
|---|
| | | params[$el.option.flag] = 1; |
|---|
| | | params["logList"].push({ |
|---|
| | | param: $el.option.flag, |
|---|
| | | paramCn: $el.title, |
|---|
| | | fake: $el.num, |
|---|
| | | st: 1, |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | updateYC(params) |
|---|
| | |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | let params = {}; |
|---|
| | | let params = { logList: [] }; |
|---|
| | | let checkList = this["checkList2_" + type]; |
|---|
| | | // 从被选中(打勾)的序号列表中 把对应同一个字段的合并为一个序号（N个同类型的每25个一个字段) (合并为一个序号取第一个用 并要想办法把合并的这些index保存来用) |
|---|
| | | // 用一个对象来存储是否有同组的已进来 |
|---|
| | |
|---|
| | | v.indexs.map((vv) => vv % 25), |
|---|
| | | 1 |
|---|
| | | ); |
|---|
| | | v.indexs.forEach((vv) => { |
|---|
| | | params["logList"].push({ |
|---|
| | | param: prop_flag + "_" + (vv % 25), |
|---|
| | | paramCn: v.$el.option.label0.replace("N", vv), |
|---|
| | | fake: 1, |
|---|
| | | st: 1, |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | } else { |
|---|
| | | params[v.$el.option.key1] = 1; |
|---|
| | | params[v.$el.option.flag] = 1; |
|---|
| | | params["logList"].push({ |
|---|
| | | param: v.$el.option.flag, |
|---|
| | | paramCn: v.$el.title, |
|---|
| | | fake: 1, |
|---|
| | | st: 1, |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | |
|---|
| | | .el_col:nth-child(n + 3) { |
|---|
| | | margin-top: 20px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </style> |
|---|
| | |
|---|
| | | Panel, |
|---|
| | | gradientBtn, |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | hasPermission() { |
|---|
| | | return this.$store.state.user.downloadFlag == 1; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | almCount: {}, |
|---|
| | |
|---|
| | | valueTime1: "", |
|---|
| | | devtypes: ["全部", "交流配电柜", "直流配电柜", "高频开关电源柜"], |
|---|
| | | almLevels: ["全部", "一般", "重大", "紧急"], |
|---|
| | | almNames: [ |
|---|
| | | |
|---|
| | | ], |
|---|
| | | almNames: [], |
|---|
| | | total: 0, |
|---|
| | | table: { |
|---|
| | | headers: [ |
|---|
| | |
|---|
| | | this.SOCKET1.send(JSON.stringify(params)); |
|---|
| | | }, |
|---|
| | | confirmAlarm(row) { |
|---|
| | | confirmAlarm(row.almId) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | console.log(data); |
|---|
| | | } |
|---|
| | | this.$confirm("确认告警提示", "系统提示", { |
|---|
| | | type: "warning", |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | confirmAlarm(row.almId) |
|---|
| | | .then((res) => { |
|---|
| | | let { code } = res.data; |
|---|
| | | if (code) { |
|---|
| | | this.$message.success("操作成功"); |
|---|
| | | this.sendMessage1(); |
|---|
| | | } else { |
|---|
| | | this.$message.success("操作失败"); |
|---|
| | | } |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | .catch(() => {}); |
|---|
| | | }, |
|---|
| | | // 展示数据数量 |
|---|
| | | handleSizeChange(val) { |
|---|
| | |
|---|
| | | background-color: #2155ff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </style> |
|---|
copy from src/views/testRecord/details.vue
copy to src/views/powerTestRecord/details.vue
| File was copied from src/views/testRecord/details.vue |
| | |
|---|
| | | <!-- 状态栏 --> |
|---|
| | | <div class="info flex-r"> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">断路器类型</div> |
|---|
| | | <div class="value">交流断路器</div> |
|---|
| | | <div class="label">设备名称</div> |
|---|
| | | <div class="value">交流配电柜</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">断路器名称</div> |
|---|
| | | <div class="value">DK11</div> |
|---|
| | | <div class="label">参数类型</div> |
|---|
| | | <div class="value">遥测量</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">动作总次数</div> |
|---|
| | | <div class="value">13</div> |
|---|
| | | <div class="label">参数名称</div> |
|---|
| | | <div class="value">第1路交流A相输入电压</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">动作日期</div> |
|---|
| | | <div class="label">模拟日期</div> |
|---|
| | | <div class="value">2023-12-08</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">第一次动作时间</div> |
|---|
| | | <div class="label">第一次模拟时间</div> |
|---|
| | | <div class="value">09:58:23</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">第一次动作</div> |
|---|
| | | <div class="label">第一次模拟数值</div> |
|---|
| | | <div class="value">合闸</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">最后一次动作时间</div> |
|---|
| | | <div class="label">最后一次模拟时间</div> |
|---|
| | | <div class="value">10:00:03</div> |
|---|
| | | </div> |
|---|
| | | <div class="info-item"> |
|---|
| | | <div class="label">最后一次动作</div> |
|---|
| | | <div class="label">最后一次模拟数值</div> |
|---|
| | | <div class="value">分闸</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <div class="chart-contain flex-r"> |
|---|
| | | <div class="name-panel"> |
|---|
| | | <div class="row"> |
|---|
| | | <div class="">断路器名称</div> |
|---|
| | | <div class="switch-name">DK11</div> |
|---|
| | | <div class="">遥测量名称</div> |
|---|
| | | <div class="switch-name">第1路交流A相输入电压</div> |
|---|
| | | </div> |
|---|
| | | <div class="row"> |
|---|
| | | <div class="">合闸</div> |
|---|
| | | <div class="">模拟次数</div> |
|---|
| | | <div class="num">7</div> |
|---|
| | | </div> |
|---|
| | | <div class="row"> |
|---|
| | | <div class="">分闸</div> |
|---|
| | | <div class="num">6</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="chart-wrap"> |
|---|
| | | <step-line></step-line> |
|---|
| | | <bar unit="V"></bar> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <!-- 表格 --> |
|---|
| | | <panel class="panel p-content"> |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">动作类型</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="devType" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in devtypes" |
|---|
| | | :key="'type_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="idx" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">操作终端</div> |
|---|
| | | <div class="value"> |
|---|
| | |
|---|
| | | <script> |
|---|
| | | import Panel from "@/components/panel.vue"; |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | import stepLine from '@/components/stepLine'; |
|---|
| | | import bar from '@/components/bar'; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | |
|---|
| | | components: { |
|---|
| | | Panel, |
|---|
| | | gradientBtn, |
|---|
| | | stepLine, |
|---|
| | | bar, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "devName", |
|---|
| | | label: "断路器位置", |
|---|
| | | label: "模拟时间", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almName", |
|---|
| | | label: "断路器名称", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | | label: "测控日期", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almStartTime", |
|---|
| | | label: "动作总次数", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almConfirmedTime", |
|---|
| | | label: "合闸次数", |
|---|
| | | label: "模拟值", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almIsConfirmed", |
|---|
| | | label: "分闸次数", |
|---|
| | | label: "操作终端", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: {}, |
|---|
| | | methods: { |
|---|
| | | getList(){ |
|---|
| | | |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() {}, |
|---|
| | | }; |
|---|
| | |
|---|
| | | } |
|---|
| | | .chart-contain { |
|---|
| | | margin-top: 8px; |
|---|
| | | height: 300px; |
|---|
| | | height: 220px; |
|---|
| | | .name-panel { |
|---|
| | | background: #00253f; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | justify-content: space-around; |
|---|
| | | align-items: center; |
|---|
| | | width: 180px; |
|---|
| | | padding: 10px; |
|---|
| | | margin-right: 10px; |
|---|
| | | .row { |
|---|
| | |
|---|
| | | color: #78EEF8; |
|---|
| | | font-size: 24px; |
|---|
| | | font-weight: 700; |
|---|
| | | text-align: center; |
|---|
| | | } |
|---|
| | | .num { |
|---|
| | | color: #78eef8; |
|---|
| | |
|---|
| | | } |
|---|
| | | .search { |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-around; |
|---|
| | | justify-content: space-between; |
|---|
| | | .s-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
copy from src/views/testRecord/index.vue
copy to src/views/powerTestRecord/index.vue
| File was copied from src/views/testRecord/index.vue |
| | |
|---|
| | | <div class="panel-content flex-c"> |
|---|
| | | <div class="search"> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测控线路</div> |
|---|
| | | <div class="label">设备名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="devType" |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">断路器名称</div> |
|---|
| | | <div class="label">参数类型</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="almLevel" |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测控日期</div> |
|---|
| | | <div class="label">参数名称</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-select |
|---|
| | | v-model="almLevel" |
|---|
| | | class="dark" |
|---|
| | | size="mini" |
|---|
| | | @change="getList" |
|---|
| | | placeholder="请选择" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="(item, idx) in almLevels" |
|---|
| | | :key="'level_' + idx" |
|---|
| | | :label="item" |
|---|
| | | :value="idx" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="s-item"> |
|---|
| | | <div class="label">测试日期</div> |
|---|
| | | <div class="value"> |
|---|
| | | <el-date-picker |
|---|
| | | v-model="date1" |
|---|
| | |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "devName", |
|---|
| | | label: "断路器位置", |
|---|
| | | label: "设备名称", |
|---|
| | | minWidth: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almName", |
|---|
| | | label: "断路器名称", |
|---|
| | | label: "参数类型", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | | label: "参数名称", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almLevelStr", |
|---|
| | |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almStartTime", |
|---|
| | | label: "动作总次数", |
|---|
| | | label: "测控次数", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almConfirmedTime", |
|---|
| | | label: "合闸次数", |
|---|
| | | label: "最后一次测控时间", |
|---|
| | | width: 180, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "almIsConfirmed", |
|---|
| | | label: "分闸次数", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | datas: [ |
|---|
| | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | details() { |
|---|
| | | this.$router.push("/test-record/details"); |
|---|
| | | this.$router.push("/data-record/power-details"); |
|---|
| | | }, |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { |
|---|
copy from src/views/testRecord/js/apis.js
copy to src/views/powerTestRecord/js/apis.js
| | |
|---|
| | | } |
|---|
| | | .batt { |
|---|
| | | height: 100%; |
|---|
| | | background: url("images/batt.png") 50% 50% / 100% 100% no-repeat; |
|---|
| | | background: url("./images/batt.png") 50% 50% / 100% 100% no-repeat; |
|---|
| | | text-align: center; |
|---|
| | | position: relative; |
|---|
| | | .name { |
|---|
| | |
|---|
| | | label="操作" |
|---|
| | | > |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-button type="primary" :disabled="!hasPermission" size="mini" |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | size="mini" |
|---|
| | | @click="updateBreaker(1, scope.row)" |
|---|
| | | >合闸</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | :disabled="!hasPermission" |
|---|
| | | type="primary" |
|---|
| | | size="mini" |
|---|
| | | @click="updateBreaker(0, scope.row)" |
|---|
| | | >分闸</el-button |
|---|
| | | > |
|---|
| | | </template> |
|---|
| | |
|---|
| | | </div> --> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="border"> |
|---|
| | | <div class="border" v-if="currIdx == 2 || currIdx == 3"> |
|---|
| | | <list-card |
|---|
| | | :datas="$data[`props${currIdx + 1}`]" |
|---|
| | | :cols="1" |
|---|
| | | :rows="4" |
|---|
| | | :valueObj="rtData" |
|---|
| | | ></list-card> |
|---|
| | | </div> |
|---|
| | | <div class="yc-panel" v-if="currIdx == 0 || currIdx == 1"> |
|---|
| | |
|---|
| | | import gauge3 from "@/components/gauge3"; |
|---|
| | | import bar1 from "@/components/bar1"; |
|---|
| | | import bar2 from "@/components/bar2"; |
|---|
| | | import { updateBreaker } from "./js/apis"; |
|---|
| | | import getBinaryDigits from "@/assets/js/getBinaryDigits"; |
|---|
| | | |
|---|
| | | import createWs from "@/assets/js/websocket/plus"; |
|---|
| | | const WSMixin = createWs("ckRtAndSignalAndHr", "breakerInfAndAlm"); |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | name: "", |
|---|
| | | |
|---|
| | | mixins: [WSMixin], |
|---|
| | | data() { |
|---|
| | | const props1 = [ |
|---|
| | | { |
|---|
| | |
|---|
| | | const props3 = [ |
|---|
| | | { |
|---|
| | | label: "1路直流电压(V)", |
|---|
| | | key: "", |
|---|
| | | // label: "1段直流母线输出电压", |
|---|
| | | key0: "dcOut1VolReal", |
|---|
| | | key1: "dcOut1VolFake", |
|---|
| | | flag: "dcOut1VolSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "1路直流电流(A)", |
|---|
| | | key: "", |
|---|
| | | // label: "1段直流母线输出电流", |
|---|
| | | key0: "dcOut1CurrReal", |
|---|
| | | key1: "dcOut1CurrFake", |
|---|
| | | flag: "dcOut1CurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "1路直流断路器总数量", |
|---|
| | | key: "", |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // label: "1路直流断路器总数量", |
|---|
| | | // key: "", |
|---|
| | | // }, |
|---|
| | | ]; |
|---|
| | | const props4 = [ |
|---|
| | | { |
|---|
| | | label: "2路直流电压(V)", |
|---|
| | | key: "", |
|---|
| | | // label: "2段直流母线输出电压", |
|---|
| | | key0: "dcOut2VolReal", |
|---|
| | | key1: "dcOut2VolFake", |
|---|
| | | flag: "dcOut2VolSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "2路直流电流(A)", |
|---|
| | | key: "", |
|---|
| | | // label: "2段直流母线输出电流", |
|---|
| | | key0: "dcOut2CurrReal", |
|---|
| | | key1: "dcOut2CurrFake", |
|---|
| | | flag: "dcOut2CurrSt", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: "2路直流断路器总数量", |
|---|
| | | key: "", |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // label: "2路直流断路器总数量", |
|---|
| | | // key: "", |
|---|
| | | // }, |
|---|
| | | ]; |
|---|
| | | // const props2 = [ |
|---|
| | | // { |
|---|
| | | // label: "电流不平衡度(%)", |
|---|
| | | // key: "", |
|---|
| | | // }, |
|---|
| | | // { |
|---|
| | | // label: "零序电流(A)", |
|---|
| | | // key: "", |
|---|
| | | // }, |
|---|
| | | // { |
|---|
| | | // label: "总有功功率", |
|---|
| | | // key: "", |
|---|
| | | // }, |
|---|
| | | // { |
|---|
| | | // label: "总功率因数", |
|---|
| | | // key: "", |
|---|
| | | // }, |
|---|
| | | // ]; |
|---|
| | | return { |
|---|
| | | switchStates: { |
|---|
| | | acin1_switch_trip: [], |
|---|
| | | acin2_switch_trip: [], |
|---|
| | | ac1_outswitch1_trip: [], |
|---|
| | | ac2_outswitch1_trip: [], |
|---|
| | | dcin1_switch_trip: [], |
|---|
| | | dcin2_switch_trip: [], |
|---|
| | | dc1_switch1_trip: [], |
|---|
| | | dc2_switch1_trip: [], |
|---|
| | | }, |
|---|
| | | rtData: {}, |
|---|
| | | currIdx: 0, |
|---|
| | | props1, |
|---|
| | | props2, |
|---|
| | |
|---|
| | | table: { |
|---|
| | | headers: [ |
|---|
| | | { |
|---|
| | | prop: "a", |
|---|
| | | prop: "breakerType", |
|---|
| | | label: "断路器类型", |
|---|
| | | minWidth: 320, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "b", |
|---|
| | | prop: "breakerName", |
|---|
| | | label: "断路器名称", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "c", |
|---|
| | | prop: "breakerAddr", |
|---|
| | | label: "所在位置", |
|---|
| | | width: 162, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "d", |
|---|
| | | prop: "breakerLevelStr", |
|---|
| | | label: "级数", |
|---|
| | | width: 80, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "e", |
|---|
| | | prop: "state", |
|---|
| | | label: "开关状态", |
|---|
| | | width: 160, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | prop: "f", |
|---|
| | | label: "告警状态", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // prop: "almState", |
|---|
| | | // label: "告警状态", |
|---|
| | | // width: 120, |
|---|
| | | // }, |
|---|
| | | ], |
|---|
| | | datas: [ |
|---|
| | | { |
|---|
| | | a: 1, |
|---|
| | | b: 2, |
|---|
| | | c: 3, |
|---|
| | | d: 4, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | a: 1, |
|---|
| | | b: 2, |
|---|
| | | c: 3, |
|---|
| | | d: 4, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | a: 1, |
|---|
| | | b: 2, |
|---|
| | | c: 3, |
|---|
| | | d: 4, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | a: 1, |
|---|
| | | b: 2, |
|---|
| | | c: 3, |
|---|
| | | d: 4, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | datas: [], |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | updateBreaker(state, record) { |
|---|
| | | this.$confirm("确认" + (state ? "合闸" : "分闸") + "?", "提示", { |
|---|
| | | type: "warning", |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | let { breakerId, breakerName, breakerAddr } = record; |
|---|
| | | let param = { |
|---|
| | | breakerId, |
|---|
| | | switchState: state, |
|---|
| | | switchNumber: breakerName, |
|---|
| | | switchScope: breakerAddr, |
|---|
| | | }; |
|---|
| | | updateBreaker(param) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data, msg } = res.data; |
|---|
| | | this.$layer.close(loading); |
|---|
| | | if (code && data) { |
|---|
| | | this.$message.success(msg); |
|---|
| | | } else { |
|---|
| | | this.$message.error(msg); |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | onWSMessage1(res) { |
|---|
| | | let { data, data2, data3 } = JSON.parse(res.data); |
|---|
| | | // console.log(data, "=====data", data2); |
|---|
| | | // this.paramsAlram(data); |
|---|
| | | this.rtData = { |
|---|
| | | ...data, |
|---|
| | | ...data2, |
|---|
| | | ...data3, |
|---|
| | | }; |
|---|
| | | |
|---|
| | | let { |
|---|
| | | acIn1SwitchTripReal, |
|---|
| | | acIn2SwitchTripReal, |
|---|
| | | ac1OutSwitch1TripReal, |
|---|
| | | ac2OutSwitch1TripReal, |
|---|
| | | dcIn1SwitchTripReal, |
|---|
| | | dcIn2SwitchTripReal, |
|---|
| | | dc1Switch1TripReal, |
|---|
| | | dc2Switch1TripReal, |
|---|
| | | } = data2; |
|---|
| | | |
|---|
| | | let ac1_outswitch1_trip = getBinaryDigits(ac1OutSwitch1TripReal); |
|---|
| | | let ac2_outswitch1_trip = getBinaryDigits(ac2OutSwitch1TripReal); |
|---|
| | | let dc1_switch1_trip = getBinaryDigits(dc1Switch1TripReal); |
|---|
| | | let dc2_switch1_trip = getBinaryDigits(dc2Switch1TripReal); |
|---|
| | | let acin1_switch_trip = [acIn1SwitchTripReal]; |
|---|
| | | let acin2_switch_trip = [acIn2SwitchTripReal]; |
|---|
| | | let dcin1_switch_trip = [dcIn1SwitchTripReal]; |
|---|
| | | let dcin2_switch_trip = [dcIn2SwitchTripReal]; |
|---|
| | | |
|---|
| | | this.switchStates = { |
|---|
| | | acin1_switch_trip, |
|---|
| | | acin2_switch_trip, |
|---|
| | | ac1_outswitch1_trip, |
|---|
| | | ac2_outswitch1_trip, |
|---|
| | | dcin1_switch_trip, |
|---|
| | | dcin2_switch_trip, |
|---|
| | | dc1_switch1_trip, |
|---|
| | | dc2_switch1_trip, |
|---|
| | | }; |
|---|
| | | |
|---|
| | | if (this.currIdx == 0 || this.currIdx == 1) { |
|---|
| | | this.updateChart(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | onWSMessage2(res) { |
|---|
| | | let { data, data2 } = JSON.parse(res.data); |
|---|
| | | // console.log(data2, "=====data"); |
|---|
| | | this.getList(data2); |
|---|
| | | }, |
|---|
| | | onWSOpen2() { |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.sendMessage2(); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | sendMessage2() { |
|---|
| | | if (!this.isWSOpen2) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | // console.log(this.actName, '.....'); |
|---|
| | | this.SOCKET2.send(this.actName); |
|---|
| | | }, |
|---|
| | | updateChart() { |
|---|
| | | let rtData = this.rtData; |
|---|
| | | let data1 = this.getVolData(rtData); |
|---|
| | | let data2 = this.getCurrData(rtData); |
|---|
| | | this.$refs.bar1.setData({ |
|---|
| | | xLabel: ["A相", "B相", "C相"], |
|---|
| | | sData: data1, |
|---|
| | | }); |
|---|
| | | this.$refs.bar2.setData({ |
|---|
| | | xLabel: ["A相", "B相", "C相"], |
|---|
| | | sData: data2, |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getVolData(data) { |
|---|
| | | let idx = (this.currIdx % 2) + 1; |
|---|
| | | let name = ""; |
|---|
| | | switch (idx) { |
|---|
| | | case 1: |
|---|
| | | name = "acIn1Vol"; |
|---|
| | | break; |
|---|
| | | |
|---|
| | | case 2: |
|---|
| | | name = "acIn2Vol"; |
|---|
| | | break; |
|---|
| | | // TODU |
|---|
| | | default: |
|---|
| | | name = "acIn1Vol"; |
|---|
| | | break; |
|---|
| | | } |
|---|
| | | return ["A", "B", "C"].map((v) => { |
|---|
| | | return data[name + v + "St"] |
|---|
| | | ? data[name + v + "Fake"] |
|---|
| | | : data[name + v + "Real"]; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getCurrData(data) { |
|---|
| | | let idx = (this.currIdx % 2) + 1; |
|---|
| | | let name = ""; |
|---|
| | | switch (idx) { |
|---|
| | | case 1: |
|---|
| | | name = "acIn1Curr"; |
|---|
| | | break; |
|---|
| | | |
|---|
| | | case 2: |
|---|
| | | name = "acIn2Curr"; |
|---|
| | | break; |
|---|
| | | // TODU |
|---|
| | | default: |
|---|
| | | name = "acIn1Curr"; |
|---|
| | | break; |
|---|
| | | } |
|---|
| | | return ["A", "B", "C"].map((v) => { |
|---|
| | | return data[name + v + "St"] |
|---|
| | | ? data[name + v + "Fake"] |
|---|
| | | : data[name + v + "Real"]; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | changeTab(idx) { |
|---|
| | | this.currIdx = idx; |
|---|
| | | this.sendMessage2(); |
|---|
| | | // this.getBreakerInfByAddr(); |
|---|
| | | }, |
|---|
| | | getList(res) { |
|---|
| | | if (res) { |
|---|
| | | let list = res.map((v) => { |
|---|
| | | v.breakerLevelStr = v.breakerLevel ? v.breakerLevel + "P" : ""; |
|---|
| | | v.almState = v.breakerAlmConifgList.length ? "告警" : "正常"; |
|---|
| | | v.state = this.switchStates[v.nodeName][v.nodeBit] ? "合闸" : "分闸"; |
|---|
| | | return v; |
|---|
| | | }); |
|---|
| | | this.table.datas = list; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() {}, |
|---|
| | | mounted() { |
|---|
| | | // this.getBreakerInfByAddr(); |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | |
|---|
| | | .p-contain { |
|---|
| | | height: 100%; |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | .side { |
|---|
| | | flex: 1; |
|---|
| | | |
|---|
| | | .content { |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | padding: 0 40px; |
|---|
| | | |
|---|
| | | .list-item { |
|---|
| | | margin-top: 30px; |
|---|
| | | height: 50px; |
|---|
| | |
|---|
| | | margin-left: 20px; |
|---|
| | | margin-right: 30px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.AC .i { |
|---|
| | | background: #78eef8 url("../images/ac1.png") 50% 50% / 60% auto |
|---|
| | | background: #78eef8 url("./images/ac1.png") 50% 50% / 60% auto |
|---|
| | | no-repeat; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.DC .i { |
|---|
| | | background: #78eef8 url("../images/dc1.png") 50% 50% / 60% auto |
|---|
| | | background: #78eef8 url("./images/dc1.png") 50% 50% / 60% auto |
|---|
| | | no-repeat; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.active { |
|---|
| | | background: #f69f40; |
|---|
| | | border-color: #f69f40; |
|---|
| | | color: #011f39; |
|---|
| | | font-weight: 700; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.active.AC .i { |
|---|
| | | background: #011f39 url("../images/ac.png") 50% 50% / 60% auto |
|---|
| | | background: #011f39 url("./images/ac.png") 50% 50% / 60% auto |
|---|
| | | no-repeat; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.active.DC .i { |
|---|
| | | background: #011f39 url("../images/dc.png") 50% 50% / 60% auto |
|---|
| | | background: #011f39 url("./images/dc.png") 50% 50% / 60% auto |
|---|
| | | no-repeat; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .main { |
|---|
| | | flex: 2.476; |
|---|
| | | margin-left: 10px; |
|---|
| | |
|---|
| | | .panel .content { |
|---|
| | | height: 100%; |
|---|
| | | padding: 10px; |
|---|
| | | |
|---|
| | | .tableCent { |
|---|
| | | background: #00253f; |
|---|
| | | color: #fff; |
|---|
| | | |
|---|
| | | &::before { |
|---|
| | | height: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/ th.el-table__cell { |
|---|
| | | background: #0c4d77; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #fff; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/ th.el-table__cell.is-leaf, |
|---|
| | | /deep/ td.el-table__cell { |
|---|
| | | border: 0 none; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/ tr { |
|---|
| | | background: #153953; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/ |
|---|
| | | .el-table__body |
|---|
| | | tr.hover-row.hover-row.hover-row |
|---|
| | | > td.el-table__cell { |
|---|
| | | background: #4871e3; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/ .el-table__body tr.el-table__row--striped td.el-table__cell { |
|---|
| | | background: #0d314b; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .row { |
|---|
| | | flex: 1.378; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .row1 { |
|---|
| | | color: #fff; |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 10px; |
|---|
| | | |
|---|
| | | .content { |
|---|
| | | display: flex; |
|---|
| | | } |
|---|
| | |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | margin-left: 10px; |
|---|
| | | |
|---|
| | | &:first-child { |
|---|
| | | margin-left: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .yc-title { |
|---|
| | | text-align: center; |
|---|
| | | font-size: 18px; |
|---|
| | |
|---|
| | | line-height: 36px; |
|---|
| | | background: #0c4d77; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .yc-content { |
|---|
| | | flex: 1; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | background: #011f39; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .bar-contain { |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .info { |
|---|
| | | // line-height: 1.4; |
|---|
| | | padding: 0 18px 20px 12px; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | |
|---|
| | | .value { |
|---|
| | | background: #0c4d77; |
|---|
| | | width: 60px; |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .border { |
|---|
| | | flex: 1; |
|---|
| | | border-radius: 6px; |
|---|
| | |
|---|
| | | background: #011f39; |
|---|
| | | padding: 46px 8px; |
|---|
| | | margin-left: 10px; |
|---|
| | | |
|---|
| | | &:only-child { |
|---|
| | | margin-left: auto; |
|---|
| | | margin-right: auto; |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | import axios from "axios"; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 根据断路器位置获取断路器信息和告警状态 |
|---|
| | | */ |
|---|
| | | export const getBreakerInfByAddr = (breakAddr) => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "breakerInf/getBreakerInfByAddr", |
|---|
| | | params: { breakAddr }, |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 断路器合闸 分闸操作 |
|---|
| | | * { |
|---|
| | | * breakerId, |
|---|
| | | * switchState, |
|---|
| | | * switchNumber, |
|---|
| | | * switchScope |
|---|
| | | * } |
|---|
| | | */ |
|---|
| | | export const updateBreaker = (data) => { |
|---|
| | | return axios({ |
|---|
| | | method: "POST", |
|---|
| | | url: "ckPowerDevBreakerControl/update", |
|---|
| | | data, |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | |
|---|
| | | this.$emit("success"); |
|---|
| | | this.$message.success("操作成功"); |
|---|
| | | } else { |
|---|
| | | this.$message.success("操作失败"); |
|---|
| | | this.$message.error("操作失败"); |
|---|
| | | } |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }) |
|---|
| | |
|---|
| | | this.$emit("success"); |
|---|
| | | this.$message.success("操作成功"); |
|---|
| | | } else { |
|---|
| | | this.$message.success("操作失败"); |
|---|
| | | this.$message.error("操作失败"); |
|---|
| | | } |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }) |
|---|
| | |
|---|
| | | params: { uid }, |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 重置用户密码 |
|---|
| | | * |
|---|
| | | */ |
|---|
| | | export const resetSnId = (uid) => { |
|---|
| | | return axios({ |
|---|
| | | method: "GET", |
|---|
| | | url: "userInf/resetSnId", |
|---|
| | | params: { uid }, |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | |
|---|
| | | |
|---|
| | | <!-- 用户列表 --> |
|---|
| | | <div class="table-wrap"> |
|---|
| | | <el-table class="table-dark" stripe height="100%" |
|---|
| | | size="small" :data="tableData" style="width: 100%"> |
|---|
| | | <el-table |
|---|
| | | class="table-dark" |
|---|
| | | stripe |
|---|
| | | height="100%" |
|---|
| | | size="small" |
|---|
| | | :data="tableData" |
|---|
| | | style="width: 100%" |
|---|
| | | > |
|---|
| | | <el-table-column |
|---|
| | | type="index" |
|---|
| | | label="序号" |
|---|
| | |
|---|
| | | :min-width="header.width" |
|---|
| | | align="center" |
|---|
| | | ></el-table-column> |
|---|
| | | <el-table-column label="操作" width="260" align="center"> |
|---|
| | | <el-table-column label="操作" width="360" align="center"> |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | |
|---|
| | | :disabled="scope.row.uid == uid" |
|---|
| | | @click="edit(scope.row)" |
|---|
| | | >编辑</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | size="mini" |
|---|
| | | :disabled="scope.row.uid == uid" |
|---|
| | | @click="resetSnId(scope.row)" |
|---|
| | | >重置密码</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | type="danger" |
|---|
| | |
|---|
| | | import Panel from "@/components/panel.vue"; |
|---|
| | | import gradientBtn from "@/components/gradientBtn.vue"; |
|---|
| | | |
|---|
| | | import { getAllUser, deleteUser, dropRole, improveRole } from "./api"; |
|---|
| | | import { |
|---|
| | | getAllUser, |
|---|
| | | deleteUser, |
|---|
| | | dropRole, |
|---|
| | | improveRole, |
|---|
| | | resetSnId, |
|---|
| | | } from "./api"; |
|---|
| | | import AddEdit from "./addEdit"; |
|---|
| | | import { mapGetters } from "vuex"; |
|---|
| | | export default { |
|---|
| | |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | resetSnId(record) { |
|---|
| | | this.$confirm("确认重置该用户密码吗", "系统提示", { |
|---|
| | | type: "warning", |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | let loading = this.$layer.loading(); |
|---|
| | | resetSnId(record.uid) |
|---|
| | | .then((res) => { |
|---|
| | | let { code, data, msg } = res.data; |
|---|
| | | if (code && data) { |
|---|
| | | this.$message.success(msg); |
|---|
| | | } else { |
|---|
| | | this.$message.error(msg); |
|---|
| | | } |
|---|
| | | this.$layer.close(loading); |
|---|
| | | }) |
|---|
| | | .catch((err) => { |
|---|
| | | this.$layer.close(loading); |
|---|
| | | console.log(err); |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | .catch(() => {}); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | mounted() { |
|---|
| | |
|---|
| | | .btn-grp { |
|---|
| | | padding: 0.6em; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </style> |
|---|
| | |
|---|
| | | import { defineConfig } from "vite"; |
|---|
| | | import { defineConfig, loadEnv } from "vite"; |
|---|
| | | import vue from "@vitejs/plugin-vue2"; |
|---|
| | | import { nodePolyfills } from "vite-plugin-node-polyfills"; |
|---|
| | | import { viteCommonjs } from "@originjs/vite-plugin-commonjs"; |
|---|
| | | import babel from "vite-plugin-babel"; |
|---|
| | | import dns from "dns"; |
|---|
| | | |
|---|
| | | import vueJsx from '@vitejs/plugin-vue2-jsx' |
|---|
| | | import langJsx from 'vite-plugin-lang-jsx' |
|---|
| | | import path from 'path' |
|---|
| | | import { createSvgIconsPlugin } from 'vite-plugin-svg-icons' |
|---|
| | | import vueJsx from "@vitejs/plugin-vue2-jsx"; |
|---|
| | | import langJsx from "vite-plugin-lang-jsx"; |
|---|
| | | import path from "path"; |
|---|
| | | import { createSvgIconsPlugin } from "vite-plugin-svg-icons"; |
|---|
| | | |
|---|
| | | import { svgBuilder } from './src/assets/js/svgBuilder'; |
|---|
| | | import { injectHtml } from "vite-plugin-html"; |
|---|
| | | import { svgBuilder } from "./src/assets/js/svgBuilder"; |
|---|
| | | |
|---|
| | | dns.setDefaultResultOrder("verbatim"); |
|---|
| | | export default defineConfig({ |
|---|
| | | plugins: [ |
|---|
| | | // 必须写在vue、vueJsx之前 |
|---|
| | | langJsx()[1], |
|---|
| | | vue(), |
|---|
| | | vueJsx({}), |
|---|
| | | viteCommonjs(), |
|---|
| | | // 这里已经将src/icons/svg/下的svg全部导入，无需再单独导入 |
|---|
| | | svgBuilder('./src/icons/'), |
|---|
| | | // createSvgIconsPlugin({ |
|---|
| | | // iconDirs: [path.resolve(process.cwd(), "src/icons")], // icon存放的目录 |
|---|
| | | // symbolId: "icon-[name]", // symbol的id |
|---|
| | | // // inject: "body-last", // 插入的位置 |
|---|
| | | // // customDomId: "__svg__icons__dom__" // svg的id |
|---|
| | | // }), |
|---|
| | | export default defineConfig(({ mode }) => { |
|---|
| | | // 加载环境变量，因为 vite 中不会加载以 VUE 开头的，我们得自己指定下 |
|---|
| | | const envPrefix = ["VUE"]; |
|---|
| | | const env = loadEnv(mode, process.cwd(), envPrefix); |
|---|
| | | return { |
|---|
| | | plugins: [ |
|---|
| | | // 必须写在vue、vueJsx之前 |
|---|
| | | langJsx()[1], |
|---|
| | | vue(), |
|---|
| | | vueJsx({}), |
|---|
| | | viteCommonjs(), |
|---|
| | | // 这里已经将src/icons/svg/下的svg全部导入，无需再单独导入 |
|---|
| | | svgBuilder("./src/icons/"), |
|---|
| | | // createSvgIconsPlugin({ |
|---|
| | | // iconDirs: [path.resolve(process.cwd(), "src/icons")], // icon存放的目录 |
|---|
| | | // symbolId: "icon-[name]", // symbol的id |
|---|
| | | // // inject: "body-last", // 插入的位置 |
|---|
| | | // // customDomId: "__svg__icons__dom__" // svg的id |
|---|
| | | // }), |
|---|
| | | |
|---|
| | | babel({ |
|---|
| | | filter: /^.*node_modules\/element-ui.*\.js?$/, |
|---|
| | | }), |
|---|
| | | nodePolyfills({ |
|---|
| | | // Whether to polyfill `node:` protocol imports. |
|---|
| | | protocolImports: true, |
|---|
| | | }), |
|---|
| | | ], |
|---|
| | | server: { |
|---|
| | | host: '0.0.0.0', |
|---|
| | | port: 8080 |
|---|
| | | }, |
|---|
| | | base: "./", |
|---|
| | | resolve: { |
|---|
| | | extensions: [".js", ".vue"], |
|---|
| | | alias: [{ find: /^@\/(.*)$/, replacement: "/src/$1" }], |
|---|
| | | }, |
|---|
| | | babel({ |
|---|
| | | filter: /^.*node_modules\/element-ui.*\.js?$/, |
|---|
| | | }), |
|---|
| | | nodePolyfills({ |
|---|
| | | // Whether to polyfill `node:` protocol imports. |
|---|
| | | protocolImports: true, |
|---|
| | | }), |
|---|
| | | injectHtml({ |
|---|
| | | minify: true, |
|---|
| | | template: "./index.html", |
|---|
| | | // entry: "./src/main.js", // 这个会帮我们注入入口 js 文件 |
|---|
| | | // entry: "src/main.js", // 这个会帮我们注入入口 js 文件 |
|---|
| | | data: { |
|---|
| | | // 这是我们 index.html 用到的环境变量 |
|---|
| | | ...env, |
|---|
| | | title: '', |
|---|
| | | injectScript: `<script type="module" src="./src/main.js"></script>` |
|---|
| | | }, |
|---|
| | | }), |
|---|
| | | ], |
|---|
| | | server: { |
|---|
| | | host: "0.0.0.0", |
|---|
| | | port: 8080, |
|---|
| | | }, |
|---|
| | | base: "./", |
|---|
| | | resolve: { |
|---|
| | | extensions: [".js", ".vue"], |
|---|
| | | alias: [{ find: /^@\/(.*)$/, replacement: "/src/$1" }], |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }); |
|---|
