From 8c610945469c4a4a0b0ff2b868e87f25fe01792d Mon Sep 17 00:00:00 2001
From: zhaowei <zhaowei>
Date: 星期三, 18 六月 2025 14:01:46 +0800
Subject: [PATCH] 1、设备日志页面列表及状态横向分布图新增故障状态颜色区分以及增加故障日志列表页签 2、设备日志页面历史记录弹窗中状态横向分布图新增故障状态颜色区分
---
src/views/mdc/base/DeviceLog.vue | 2
src/views/mdc/base/modules/DeviceLog/FaultLogList.vue | 125 ++++++
src/views/mdc/base/modules/DeviceLog/WorkChartModel.vue | 175 +++-----
src/views/mdc/base/modules/DeviceLog/LogList.vue | 78 +--
src/views/mdc/base/modules/DeviceLog/LogInfo.vue | 290 ++++++--------
src/views/mdc/base/modules/DeviceLog/WorkHistoryModel.vue | 321 ++++++---------
src/views/mdc/base/modules/DeviceLog/AlarmLogList.vue | 63 --
src/views/mdc/base/modules/DeviceLog/WorkLogList.vue | 136 ++----
8 files changed, 527 insertions(+), 663 deletions(-)
diff --git a/src/views/mdc/base/DeviceLog.vue b/src/views/mdc/base/DeviceLog.vue
index 45817e3..303d4fe 100644
--- a/src/views/mdc/base/DeviceLog.vue
+++ b/src/views/mdc/base/DeviceLog.vue
@@ -6,7 +6,7 @@
<base-tree @getCurrSelected="changeSelectionNode"></base-tree>
</a-col>
<a-col :md="24-5" :sm="24">
- <log-info :equipment="selectEquipment"></log-info>
+ <log-info :equipment="selectEquipment" @initEquipment="changeSelectionNode"></log-info>
</a-col>
</a-row>
</div>
diff --git a/src/views/mdc/base/modules/DeviceLog/AlarmLogList.vue b/src/views/mdc/base/modules/DeviceLog/AlarmLogList.vue
index 4aa3935..f510ee4 100644
--- a/src/views/mdc/base/modules/DeviceLog/AlarmLogList.vue
+++ b/src/views/mdc/base/modules/DeviceLog/AlarmLogList.vue
@@ -1,42 +1,27 @@
<template>
- <a-card :bordered="false">
- <!-- table鍖哄煙-begin -->
- <div class="table_alarmLogist">
- <a-table ref="table" bordered size="middle" :rowKey="(record,index)=>{return index}" :columns="columns"
- :dataSource="dataList" :pagination="false" :loading="loadingwarnStatus">
- <template slot="status" slot-scope="status">
- <div v-if="status == '3' || status == '23'" style="color: #00ee00;width: 100%; height: 100%;">杩愯</div>
- <div v-else-if="status == '1' || status == '2'" style="color: #ffea91;width: 100%; height: 100%;">寰呮満</div>
- <div v-else-if="status == '0'" style="color: #A8A8A8;width: 100%; height: 100%;">鍏虫満</div>
- <div v-else-if="status == '22'" style="color: red;width: 100%; height: 100%;">鎶ヨ</div>
- </template>
- </a-table>
- </div>
- </a-card>
+ <div class="table_alarmLogist">
+ <a-table ref="table" bordered size="middle" :rowKey="(record,index)=>{return index}" :columns="columns"
+ :dataSource="dataList" :pagination="false" :loading="loading">
+ <template slot="status" slot-scope="status">
+ <div v-if="status == '3' || status == '23'" style="color: #00ee00;width: 100%; height: 100%;">杩愯</div>
+ <div v-else-if="status == '1' || status == '2'" style="color: #ffea91;width: 100%; height: 100%;">寰呮満</div>
+ <div v-else-if="status == '0'" style="color: #A8A8A8;width: 100%; height: 100%;">鍏虫満</div>
+ <div v-else-if="status == '22'" style="color: red;width: 100%; height: 100%;">鎶ヨ</div>
+ </template>
+ </a-table>
+ </div>
</template>
<script>
- import JDictSelectTag from '@/components/dict/JDictSelectTag'
-
- import JInput from '@/components/jeecg/JInput'
- import JEllipsis from '@/components/jeecg/JEllipsis'
- import Tooltip from 'ant-design-vue/es/tooltip'
-
export default {
name: 'AlarmLogList',
- components: {
- Tooltip,
- JDictSelectTag,
- JInput,
- JEllipsis
- },
props: {
dataList: {
type: Array,
required: true,
default: []
},
- loadingwarnStatus:{
+ loading:{
type:Boolean,
default: false
}
@@ -55,22 +40,17 @@
title: '鎶ヨ鏃堕棿',
align: 'center',
dataIndex: 'startTime',
- // defaultSortOrder:'descend',
- // sorter: (a, b) => {return a.startTime>b.startTime?1:-1}
},
{
title: '缁撴潫鏃堕棿',
align: 'center',
dataIndex: 'endTime',
- // defaultSortOrder:'descend',
- // sorter: (a, b) => {return a.endTime>b.endTime?1:-1}
},
{
title: '鎸佺画鏃堕棿',
align: 'center',
dataIndex: 'duration',
customRender:(t,r,index) =>{
- // console.log(t)
var ss = parseInt(t)
if(ss>=3600){
// 鏍规嵁绉掓暟杞崲鎴愬搴旂殑鏃跺垎绉�
@@ -91,13 +71,6 @@
return hour + '灏忔椂' + min + '鍒�' + sec + '绉�'
}
}
- // if(sec == '00'){
- // return hour + '灏忔椂' + min + '鍒�'
- // }
- // if(min == '00' && sec == '00'){
- // return hour + '灏忔椂'
- // }
- // return hour + '灏忔椂' + min + '鍒�' + sec + '绉�'
}else if(60<ss && ss<3600){
const min1 = parseInt(ss % 3600 / 60) < 10 ? '0' + parseInt(ss % 3600 / 60) : parseInt(ss % 3600 / 60)
@@ -108,8 +81,6 @@
return sec2 + '绉�'
}
}
- // defaultSortOrder:'descend',
- // sorter: (a, b) => {return a.duration>b.duration?1:-1}
},
{
title: '鎶ヨ鍙�',
@@ -137,31 +108,31 @@
@media screen and (min-width: 1920px){
.table_alarmLogist{
height: 417px!important;
- overflow: scroll;
+ overflow: auto;
}
}
@media screen and (min-width: 1680px) and (max-width: 1920px){
.table_alarmLogist{
height: 417px!important;
- overflow: scroll;
+ overflow: auto;
}
}
@media screen and (min-width: 1400px) and (max-width: 1680px){
.table_alarmLogist{
height: 266px!important;
- overflow: scroll;
+ overflow: auto;
}
}
@media screen and (min-width: 1280px) and (max-width: 1400px){
.table_alarmLogist{
height: 360px!important;
- overflow: scroll;
+ overflow: auto;
}
}
@media screen and (max-width: 1280px){
.table_alarmLogist{
height: 170px!important;
- overflow: scroll;
+ overflow: auto;
}
}
</style>
diff --git a/src/views/mdc/base/modules/DeviceLog/FaultLogList.vue b/src/views/mdc/base/modules/DeviceLog/FaultLogList.vue
new file mode 100644
index 0000000..68657a4
--- /dev/null
+++ b/src/views/mdc/base/modules/DeviceLog/FaultLogList.vue
@@ -0,0 +1,125 @@
+<template>
+ <div class="table_alarmLogist">
+ <a-table ref="table" bordered size="middle" :rowKey="(record,index)=>{return index}" :columns="columns"
+ :dataSource="dataList" :pagination="false" :loading="loading">
+ <template slot="status" slot-scope="status">
+ <div v-if="status == '25'" style="color: #C11900;width: 100%; height: 100%;">鏁呴殰</div>
+ </template>
+ </a-table>
+ </div>
+</template>
+
+<script>
+ export default {
+ name: 'FaultLogList',
+ props: {
+ dataList: {
+ type: Array,
+ required: true,
+ default: []
+ },
+ loading: {
+ type: Boolean,
+ default: false
+ }
+ },
+ data() {
+ return {
+ disabled: true,
+ columns: [
+ {
+ title: '鐘舵��',
+ align: 'center',
+ dataIndex: 'status',
+ scopedSlots: { customRender: 'status' }
+ },
+ {
+ title: '鏁呴殰鏃堕棿',
+ align: 'center',
+ dataIndex: 'startTime'
+ },
+ {
+ title: '缁撴潫鏃堕棿',
+ align: 'center',
+ dataIndex: 'endTime'
+ },
+ {
+ title: '鎸佺画鏃堕棿',
+ align: 'center',
+ dataIndex: 'duration',
+ customRender: (t, r, index) => {
+ var ss = parseInt(t)
+ if (ss >= 3600) {
+ // 鏍规嵁绉掓暟杞崲鎴愬搴旂殑鏃跺垎绉�
+ const hour = parseInt(ss / 3600) < 10 ? '0' + parseInt(ss / 3600) : parseInt(ss / 3600)
+ const min = parseInt(ss % 3600 / 60) < 10 ? '0' + parseInt(ss % 3600 / 60) : parseInt(ss % 3600 / 60)
+ const sec = parseInt(ss % 3600 % 60) < 10 ? '0' + parseInt(ss % 3600 % 60) : parseInt(ss % 3600 % 60)
+ if (min == '00') {
+ if (sec == '00') {
+ return hour + '灏忔椂'
+ } else {
+ return hour + '灏忔椂' + sec + '绉�'
+ }
+
+ } else {
+ if (sec == '00') {
+ return hour + '灏忔椂' + min + '鍒�'
+ } else {
+ return hour + '灏忔椂' + min + '鍒�' + sec + '绉�'
+ }
+ }
+
+ } else if (60 < ss && ss < 3600) {
+ const min1 = parseInt(ss % 3600 / 60) < 10 ? '0' + parseInt(ss % 3600 / 60) : parseInt(ss % 3600 / 60)
+ const sec1 = parseInt(ss % 3600 % 60) < 10 ? '0' + parseInt(ss % 3600 % 60) : parseInt(ss % 3600 % 60)
+ return min1 + '鍒�' + sec1 + '绉�'
+ } else {
+ const sec2 = parseInt(ss % 3600 % 60) < 10 ? '0' + parseInt(ss % 3600 % 60) : parseInt(ss % 3600 % 60)
+ return sec2 + '绉�'
+ }
+ }
+ },
+ ]
+ }
+ }
+ }
+</script>
+
+<style lang="less" scoped>
+ @import '~@assets/less/common.less';
+
+ @media screen and (min-width: 1920px) {
+ .table_alarmLogist {
+ height: 417px !important;
+ overflow: auto;
+ }
+ }
+
+ @media screen and (min-width: 1680px) and (max-width: 1920px) {
+ .table_alarmLogist {
+ height: 417px !important;
+ overflow: auto;
+ }
+ }
+
+ @media screen and (min-width: 1400px) and (max-width: 1680px) {
+ .table_alarmLogist {
+ height: 266px !important;
+ overflow: auto;
+ }
+ }
+
+ @media screen and (min-width: 1280px) and (max-width: 1400px) {
+ .table_alarmLogist {
+ height: 360px !important;
+ overflow: auto;
+ }
+ }
+
+ @media screen and (max-width: 1280px) {
+ .table_alarmLogist {
+ height: 170px !important;
+ overflow: auto;
+ }
+ }
+</style>
diff --git a/src/views/mdc/base/modules/DeviceLog/LogInfo.vue b/src/views/mdc/base/modules/DeviceLog/LogInfo.vue
index da70e00..9b03a2c 100644
--- a/src/views/mdc/base/modules/DeviceLog/LogInfo.vue
+++ b/src/views/mdc/base/modules/DeviceLog/LogInfo.vue
@@ -6,18 +6,18 @@
<a-row :gutter="24">
<a-col :md="4" :sm="4">
<a-form-item label="璁惧缂栧彿">
- <a-input placeholder="璇烽�夋嫨璁惧" :readOnly="readOnly" v-model="queryParams.equipmentId"></a-input>
+ <a-input placeholder="璇烽�夋嫨璁惧" readOnly v-model="queryParams.equipmentId"></a-input>
</a-form-item>
</a-col>
<a-col :md="6" :sm="6">
<a-form-item label="璁惧鍚嶇О">
- <a-input placeholder="璇烽�夋嫨璁惧" :readOnly="readOnly" v-model="queryParams.equipmentName"></a-input>
+ <a-input placeholder="璇烽�夋嫨璁惧" readOnly v-model="queryParams.equipmentName"></a-input>
</a-form-item>
</a-col>
<a-col :md="4" :sm="4">
<a-form-item label="鏃ユ湡">
- <a-date-picker v-model="queryParams.collectTime" :disabledDate="disabledDate" @change="dataChange"
- format='YYYY-MM-DD'/>
+ <a-date-picker v-model="queryParams.collectTimeStr" :disabledDate="disabledDate"
+ value-format='YYYY-MM-DD'/>
</a-form-item>
</a-col>
<a-col :md="2" :sm="2" :xs="2">
@@ -29,7 +29,8 @@
</a-row>
</a-form>
</div>
- <div style="width: 100%;height: 180px;border: none;" align="center">
+
+ <div>
<table cellpadding="0" cellspacing="0" width="100%">
<tr>
<td>
@@ -63,9 +64,15 @@
</div>
<div v-if="item.status == 22" style="z-index: 999;"
:style='{display: "inline-block",left:item.left,width:item.dateProportion, height: "100%",position:"absolute"}'
- v-for="item in waring">
+ v-for="item in warning">
<span
:style='{display: "inline-block",width:"100%", left:0, height: "68%", background: "#FD0008",position:"absolute",bottom:"0"}'></span>
+ </div>
+ <div v-if="item.status == 25" style="z-index: 1000;"
+ :style='{display: "inline-block",left:item.left,width:item.dateProportion, height: "100%",position:"absolute"}'
+ v-for="item in fault">
+ <span
+ :style='{display: "inline-block",width:"100%", left:0, height: "50%", background: "#C11900",position:"absolute",bottom:"0"}'></span>
</div>
</div>
</td>
@@ -104,56 +111,47 @@
</table>
</td>
</tr>
- <tr>
- <td>
- <table width="400px;" align="center" style="margin-top: 20px;">
- <tr>
- <td align="right"><a id="btnMdcLogPreviousDay" style="margin-right:15px">
- <img @click="dataBefore" src="../../../../../assets/image/left.png" alt="">
- </a></td>
- <td align="right">鍏虫満</td>
- <td align="left">
- <div style="width: 15px;height: 15px;background-color: #A8A8A8;position: static;"/>
- </td>
- <td align="right">寰呮満</td>
- <td align="left">
- <div style="width: 15px;height: 15px;background-color: #ffea91"/>
- </td>
- <td align="right">杩愯</td>
- <td align="left">
- <div style="width: 15px;height: 15px;background-color: #00ee00"/>
- </td>
- <td align="right">鎶ヨ</td>
- <td align="left">
- <div style="width: 15px;height: 15px;background-color: red"/>
- </td>
- <td><a id="btnMdcLogAfterDay" style="margin-left:20px">
- <img @click="dataAfter" src="../../../../../assets/image/right.png" alt="">
- </a></td>
- </tr>
- </table>
- </td>
- </tr>
</table>
+
+ <a-space class="date-change-container">
+ <img @click="dataBefore" src="@/assets/image/left.png" alt="">
+ <span>鍏虫満</span>
+ <div style="background-color: #A8A8A8"/>
+ <span>寰呮満</span>
+ <div style="background-color: #ffea91"/>
+ <span>杩愯</span>
+ <div style="background-color: #00ee00"/>
+ <span>鎶ヨ</span>
+ <div style="background-color: #f00"/>
+ <span>鏁呴殰</span>
+ <div style="background-color: #C11900"/>
+ <img @click="dataAfter" src="@/assets/image/right.png" alt="">
+ </a-space>
</div>
- <div id="mdcLogTabs" class="mdcLogTabs-title" style="width: 100%;">
+
+ <div id="mdcLogTabs" class="mdcLogTabs-title">
<div>
- <a-tabs :activeKey="activeKey" @change="tabChange">
+ <a-tabs>
<a-tab-pane key="1" tab="璁惧鏃ュ織" force-render>
- <log-list :dataList='normalList' ref="logList" :loadingequip='loadingStatus'></log-list>
+ <log-list :dataList='normalList' :loading='loading'/>
</a-tab-pane>
<a-tab-pane key="2" tab="杩愯鏃ュ織">
- <work-log-list :dataList='runList' ref="workLogList" :loadingrun="loadingRunStatus"></work-log-list>
+ <work-log-list :dataList='runList' :loading="loading"/>
</a-tab-pane>
<a-tab-pane key="3" tab="鎶ヨ鏃ュ織">
- <alarm-log-list :dataList='waringList' ref="alarmLogList" :loadingwarn="loadingWarnStatus"></alarm-log-list>
+ <alarm-log-list :dataList='warningList' :loading="loading"/>
+ </a-tab-pane>
+ <a-tab-pane key="4" tab="鏁呴殰鏃ュ織">
+ <fault-log-list :dataList='faultList' :loading="loading"/>
</a-tab-pane>
</a-tabs>
</div>
</div>
+
<work-chart-model ref="workChartModel" :collectTime="this.queryParams.collectTime"
- :equipment="this.equipment"></work-chart-model>
- <work-history-model ref="workHistoryModel"></work-history-model>
+ :equipment="equipment"/>
+
+ <work-history-model ref="workHistoryModel"/>
</div>
</template>
@@ -163,12 +161,14 @@
import LogList from './LogList'
import WorkLogList from './WorkLogList'
import AlarmLogList from './AlarmLogList'
+ import FaultLogList from './FaultLogList'
import WorkChartModel from './WorkChartModel'
import WorkHistoryModel from './WorkHistoryModel'
import { getAction } from '@/api/manage'
export default {
- components: {
+ components: {
+ FaultLogList,
LogList,
WorkLogList,
AlarmLogList,
@@ -178,101 +178,82 @@
props: { equipment: {} },
data() {
return {
- readOnly: true,
- defaultId: '',
- defaultName: '',
- middleTime: '',
queryParam: {},
queryParams: {
- collectTime: undefined
+ collectTimeStr: moment().format('YYYY-MM-DD')
},
- loadingStatus: false,
- loadingRunStatus: false,
- loadingWarnStatus: false,
+ loading: false,
normal: [],
- waring: [],
+ warning: [],
+ fault: [],
normalList: [],
- waringList: [],
+ warningList: [],
+ faultList: [],
runList: [],
- activeKey: '1',
- equipment: {},
url: {
- getBaseTree: '/mdc/mdcequipment/loadTree',
getEquipmentByPid: '/mdc/mdcEquipment/getEquipmentByPid',
list: '/mdc/mdcEquipmentRunningSection/logList'
- },
- ProStartId: ''
+ }
}
},
methods: {
- tabChange(val) {
- this.activeKey = val
- },
disabledDate(current) {
return current && current > moment().subtract('days', 0)
},
queryChart() {
- // this.normal = []
- // this.waring = []
- this.loadingStatus = true
- this.loadingRunStatus = true
- this.loadingWarnStatus = true
- getAction(this.url.list, this.queryParams).then((res) => {
- this.normalList = []
- this.waringList = []
- this.runList = []
- this.loadingStatus = false
- this.loadingRunStatus = false
- this.loadingWarnStatus = false
- this.normal = []
- this.waring = []
- if (res.success) {
- if (res.result != null) {
- for (let i = 0; i < res.result.length; i++) {
- this.normalList.push(res.result[i])
- if ('22' == res.result[i].status) {
- this.waringList.push(res.result[i])
+ this.loading = true
+ this.normalList = []
+ this.warningList = []
+ this.runList = []
+ this.faultList = []
+ this.normal = []
+ this.warning = []
+ this.fault = []
+ getAction(this.url.list, this.queryParams)
+ .then((res) => {
+ if (res.success) {
+ if (res.result != null) {
+ for (let i = 0; i < res.result.length; i++) {
+ this.normalList.push(res.result[i])
res.result[i].dateProportion = res.result[i].duration / 86400 * 100 + '%'
- let leftTmp = (moment(res.result[i].startTime, 'YYYY-MM-DD HH:mm:ss').valueOf() - 57600000) / 1000 % 86400
- res.result[i].left = leftTmp / 86400 * 100 + '%'
- this.waring.push(res.result[i])
-
- } else if ('3' == res.result[i].status) {
- this.runList.push(res.result[i])
- res.result[i].dateProportion = res.result[i].duration / 86400 * 100 + '%'
- this.normal.push(res.result[i])
- } else {
- res.result[i].dateProportion = res.result[i].duration / 86400 * 100 + '%'
- this.normal.push(res.result[i])
+ if ('22' == res.result[i].status) {
+ let leftTmp = (moment(res.result[i].startTime, 'YYYY-MM-DD HH:mm:ss').valueOf() - 57600000) / 1000 % 86400
+ res.result[i].left = leftTmp / 86400 * 100 + '%'
+ this.warning.push(res.result[i])
+ this.warningList.push(res.result[i])
+ } else if ('25' == res.result[i].status) {
+ let leftTmp = (moment(res.result[i].startTime, 'YYYY-MM-DD HH:mm:ss').valueOf() - 57600000) / 1000 % 86400
+ res.result[i].left = leftTmp / 86400 * 100 + '%'
+ this.faultList.push(res.result[i])
+ this.fault.push(res.result[i])
+ } else if ('3' == res.result[i].status) {
+ this.runList.push(res.result[i])
+ this.normal.push(res.result[i])
+ } else {
+ this.normal.push(res.result[i])
+ }
}
}
}
- }
- }).finally(() => {
- this.loading = false
- this.cardLoading = false
- })
- },
- dataChange(val) {
- this.queryParams.collectTime = val
- this.queryParams.collectTimeStr = this.queryParams.collectTime.format('YYYY-MM-DD')
+ })
+ .finally(() => {
+ this.loading = false
+ })
},
searchQuery() {
- // console.log(this.queryParams.collectTime)
- this.queryParams.collectTimeStr = this.queryParams.collectTime.format('YYYY-MM-DD')
if (!this.queryParams.equipmentId || !this.queryParams.equipmentName) {
this.$notification.warning({
message: '娑堟伅',
- description: '璇烽�夋嫨璁惧'
+ description: '璇烽�夋嫨璁惧杩涜鏌ヨ'
})
- return false
+ return
}
this.queryChart()
},
searchReset() {
this.queryParams = {
- collectTime : moment()
- }
+ collectTimeStr: moment().format('YYYY-MM-DD')
+ }
this.equipment = {}
this.queryChart()
},
@@ -282,12 +263,13 @@
message: '娑堟伅',
description: '璇烽�夋嫨璁惧杩涜鏌ヨ'
})
- } else {
- // 鍒ゆ柇鏄惁鐐瑰嚮璁惧鏃ュ織琛ㄦ牸琛岀殑鏁版嵁锛屾鏃朵负鐐瑰嚮琛ㄦ牸鏁版嵁涓篺alse
- this.$refs.workChartModel.isClicklogListRow = false
- this.$refs.workChartModel.add(this.equipment)
- this.$refs.workChartModel.title = '宸ヤ綔鏇茬嚎'
+ return
}
+
+ // 鍒ゆ柇鏄惁鐐瑰嚮璁惧鏃ュ織琛ㄦ牸琛岀殑鏁版嵁锛屾鏃朵负鐐瑰嚮琛ㄦ牸鏁版嵁涓篺alse
+ this.$refs.workChartModel.isClicklogListRow = false
+ this.$refs.workChartModel.add(this.equipment)
+ this.$refs.workChartModel.title = '宸ヤ綔鏇茬嚎'
},
openHistoryChart() {
if (!this.equipment.equipmentId) {
@@ -295,27 +277,26 @@
message: '娑堟伅',
description: '璇烽�夋嫨璁惧杩涜鏌ヨ'
})
- } else {
- this.$refs.workHistoryModel.add(this.equipment)
- this.$refs.workHistoryModel.title = '鍘嗗彶鏃ュ織'
+ return
}
+ this.$refs.workHistoryModel.add(this.equipment)
+ this.$refs.workHistoryModel.title = '鍘嗗彶鏃ュ織'
},
dataBefore() {
- this.queryParams.collectTime = moment(this.queryParams.collectTime.add(-1, 'd'), 'YYYY-MM-DD')
+ this.queryParams.collectTimeStr = moment(this.queryParams.collectTimeStr).add(-1, 'd').format('YYYY-MM-DD')
this.searchQuery()
},
dataAfter() {
- if ((this.queryParams.collectTime).format('YYYY-MM-DD') == moment().format('YYYY-MM-DD')) {
+ if (moment(this.queryParams.collectTimeStr).isSame(moment(), 'd')) {
this.$notification.warning({
message: '娑堟伅',
description: '璇烽�夋嫨浠婂ぉ浠ュ強浠婂ぉ涔嬪墠鐨勬棩鏈燂紒锛�'
})
- } else {
- this.queryParams.collectTime = moment(this.queryParams.collectTime.add(1, 'd'), 'YYYY-MM-DD')
- this.searchQuery()
+ return
}
-
+ this.queryParams.collectTimeStr = moment(this.queryParams.collectTimeStr).add(1, 'd').format('YYYY-MM-DD')
+ this.searchQuery()
},
initEquipment(id) {
let _this = this
@@ -324,11 +305,10 @@
if (res.result != null) {
_this.$set(this.queryParams, 'equipmentName', res.result.equipmentName)
_this.$set(this.queryParams, 'equipmentId', res.result.equipmentId)
- _this.equipment = res.result
- _this.searchQuery()
+ _this.$emit('initEquipment', res.result)
} else {
- this.queryParams = {}
- this.equipment = {}
+ _this.queryParams = {}
+ _this.$emit('initEquipment', {})
_this.$notification.warning({
message: '娑堟伅',
description: '璇疯仈绯荤鐞嗗憳锛屽紑鏀捐澶囨潈闄愶紒'
@@ -345,8 +325,6 @@
}
},
created() {
- this.queryParams.collectTime = moment()
- this.queryParams.collectTimeStr = this.queryParams.collectTime.format('YYYY-MM-DD')
this.initEquipment()
},
watch: {
@@ -354,7 +332,6 @@
if (val && val.equipmentId) {
this.$set(this.queryParams, 'equipmentName', val.equipmentName)
this.$set(this.queryParams, 'equipmentId', val.equipmentId)
- this.equipment = val
this.searchQuery()
} else {
this.initEquipment(val.key)
@@ -364,48 +341,25 @@
}
</script>
-<style scoped="scoped">
- .mdcLogTabs-title {
+<style scoped="scoped" lang="less">
+ .date-change-container {
display: flex;
- width: 100%;
- }
+ align-items: center;
+ justify-content: center;
+ margin-top: 20px;
- .mdcLogTabs-title > div {
- margin: 2px 5px;
- width: 100%;
- color: #000;
- font-weight: 600;
- padding: 3px;
- border-radius: 5px;
- }
+ /deep/ .ant-space-item {
+ display: flex;
+ align-items: center;
- .btnMdcLogSearch {
- position: relative;
- margin-left: 10px;
- }
+ > div {
+ width: 15px;
+ height: 15px;
+ }
+ }
- .btnMdcLogSearch .btnMdcLogSearchZi {
- position: absolute;
- left: 3px;
+ img {
+ cursor: pointer;
+ }
}
-
- .btnMdcLogSearch input {
- padding-left: 23px;
- border-radius: 5px;
- outline: none;
- color: #000;
- border: 1px solid #000;
- }
-
- #mdcLogShow {
- display: flex;
- }
-
- #mdcLogShow > div {
- flex: 1;
- }
-
- /*.mdcLogShowOne{*/
- /*position: absolute;*/
- /*}*/
</style>
diff --git a/src/views/mdc/base/modules/DeviceLog/LogList.vue b/src/views/mdc/base/modules/DeviceLog/LogList.vue
index 4888611..6a5292b 100644
--- a/src/views/mdc/base/modules/DeviceLog/LogList.vue
+++ b/src/views/mdc/base/modules/DeviceLog/LogList.vue
@@ -1,52 +1,31 @@
<template>
- <a-card :bordered="false">
- <!-- table鍖哄煙-begin -->
- <div class="table_logList">
- <a-table ref="table" bordered size="middle" :rowKey="(record,index)=>{return index}" :columns="columns"
- :dataSource="dataList" :pagination="ipagination" :loading="loadingequip" @change="handleTableChange"
- :customRow="rowClick">
- <template slot="status" slot-scope="status">
- <div v-if="status == '3' || status == '23'" style="color: #00ee00;width: 100%; height: 100%;">杩愯</div>
- <div v-else-if="status == '1' || status == '2'" style="color: #ffea91;width: 100%; height: 100%;">寰呮満</div>
- <div v-else-if="status == '0'" style="color: #A8A8A8;width: 100%; height: 100%;">鍏虫満</div>
- <div v-else-if="status == '22'" style="color: red;width: 100%; height: 100%;">鎶ヨ</div>
- </template>
- </a-table>
- </div>
- </a-card>
+ <div class="table_logList">
+ <a-table ref="table" bordered :rowKey="(record,index)=>{return index}" :columns="columns"
+ :dataSource="dataList" :pagination="ipagination" :loading="loading" @change="handleTableChange"
+ :customRow="rowClick">
+ <template slot="status" slot-scope="status">
+ <div v-if="status == '3' || status == '23'" style="color: #00ee00;width: 100%; height: 100%;">杩愯</div>
+ <div v-else-if="status == '1' || status == '2'" style="color: #ffea91;width: 100%; height: 100%;">寰呮満</div>
+ <div v-else-if="status == '0'" style="color: #A8A8A8;width: 100%; height: 100%;">鍏虫満</div>
+ <div v-else-if="status == '22'" style="color: red;width: 100%; height: 100%;">鎶ヨ</div>
+ <div v-else-if="status == '25'" style="color: #C11900;width: 100%; height: 100%;">鏁呴殰</div>
+ </template>
+ </a-table>
+ </div>
</template>
<script>
- import JDictSelectTag from '@/components/dict/JDictSelectTag'
- import {
- requestPut,
- deleteAction
- } from '@/api/manage'
-
- import JInput from '@/components/jeecg/JInput'
- import JEllipsis from '@/components/jeecg/JEllipsis'
- import Tooltip from 'ant-design-vue/es/tooltip'
- import {
- JeecgListMixin
- } from '@/mixins/JeecgListMixin'
import moment from 'moment'
export default {
name: 'LogList',
- mixins: [JeecgListMixin],
- components: {
- Tooltip,
- JDictSelectTag,
- JInput,
- JEllipsis
- },
props: {
dataList: {
type: Array,
required: true,
default: []
},
- loadingequip: {
+ loading: {
type: Boolean,
default: false
}
@@ -54,10 +33,6 @@
watch: {},
data() {
return {
- statusName: '',
- disabled: true,
- disableMixinCreated: true,
- loading: false,
ipagination: {
current: 1,
pageSize: 100,
@@ -116,14 +91,6 @@
return hour + '灏忔椂' + min + '鍒�' + sec + '绉�'
}
}
- // if(sec == '00'){
- // return hour + '灏忔椂' + min + '鍒�'
- // }
- // if(min == '00' && sec == '00'){
- // return hour + '灏忔椂'
- // }
- // return hour + '灏忔椂' + min + '鍒�' + sec + '绉�'
-
} else if (60 < ss && ss < 3600) {
const min1 = parseInt(ss % 3600 / 60) < 10 ? '0' + parseInt(ss % 3600 / 60) : parseInt(ss % 3600 / 60)
const sec1 = parseInt(ss % 3600 % 60) < 10 ? '0' + parseInt(ss % 3600 % 60) : parseInt(ss % 3600 % 60)
@@ -153,7 +120,6 @@
this.isorter.order = 'ascend' == sorter.order ? 'asc' : 'desc'
}
this.ipagination = pagination
- // this.loadData();
},
/**
* 缁欒澶囨棩蹇楄〃鏍间腑鐨勮娣诲姞鐐瑰嚮浜嬩欢
@@ -162,6 +128,9 @@
*/
rowClick(record) {
return {
+ style: {
+ cursor: 'pointer'
+ },
on: {
click: () => {
// 鍏虫満鐘舵�佽澶囨棩蹇椾笉寮瑰嚭宸ヤ綔鏇茬嚎
@@ -175,10 +144,7 @@
}
}
}
- },
- created() {
}
-
}
</script>
@@ -188,35 +154,35 @@
@media screen and (min-width: 1920px) {
.table_logList {
height: 417px !important;
- overflow: scroll;
+ overflow: auto;
}
}
@media screen and (min-width: 1680px) and (max-width: 1920px) {
.table_logList {
height: 417px !important;
- overflow: scroll;
+ overflow: auto;
}
}
@media screen and (min-width: 1400px) and (max-width: 1680px) {
.table_logList {
height: 266px !important;
- overflow: scroll;
+ overflow: auto;
}
}
@media screen and (min-width: 1280px) and (max-width: 1400px) {
.table_logList {
height: 360px !important;
- overflow: scroll;
+ overflow: auto;
}
}
@media screen and (max-width: 1280px) {
.table_logList {
height: 170px !important;
- overflow: scroll;
+ overflow: auto;
}
}
</style>
diff --git a/src/views/mdc/base/modules/DeviceLog/WorkChartModel.vue b/src/views/mdc/base/modules/DeviceLog/WorkChartModel.vue
index 864753c..4159410 100644
--- a/src/views/mdc/base/modules/DeviceLog/WorkChartModel.vue
+++ b/src/views/mdc/base/modules/DeviceLog/WorkChartModel.vue
@@ -4,67 +4,63 @@
:footer="null" :visible="visible"
@cancel="handleCancel" cancelText="鍏抽棴">
<div>
- <div>
- <a-row :gutter="24">
- <a-col :span="6">
- <a-form-item label="璁惧缂栧彿" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentId"></a-input>
- </a-form-item>
- </a-col>
- <a-col :span="6">
- <a-form-item label="鏃ユ湡" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-date-picker v-model="queryParams.paramDate" :disabledDate="disabledDate" format='YYYY-MM-DD'/>
- </a-form-item>
- </a-col>
- <a-col :span="6">
- <a-form-item label="閲囨牱鍛ㄦ湡" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-input-number v-model="queryParams.period"/>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="24">
- <a-col :span="6">
- <a-form-item label="璁惧鍚嶇О" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentName"></a-input>
- </a-form-item>
+ <a-row :gutter="24">
+ <a-col :span="6">
+ <a-form-item label="璁惧缂栧彿" :labelCol="labelCol" :wrapperCol="wrapperCol">
+ <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentId"></a-input>
+ </a-form-item>
+ </a-col>
+ <a-col :span="6">
+ <a-form-item label="鏃ユ湡" :labelCol="labelCol" :wrapperCol="wrapperCol">
+ <a-date-picker v-model="queryParams.paramDate" :disabledDate="disabledDate" format='YYYY-MM-DD'/>
+ </a-form-item>
+ </a-col>
+ <a-col :span="6">
+ <a-form-item label="閲囨牱鍛ㄦ湡" :labelCol="labelCol" :wrapperCol="wrapperCol">
+ <a-input-number v-model="queryParams.period"/>
+ </a-form-item>
+ </a-col>
+ </a-row>
+ <a-row :gutter="24">
+ <a-col :span="6">
+ <a-form-item label="璁惧鍚嶇О" :labelCol="labelCol" :wrapperCol="wrapperCol">
+ <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentName"></a-input>
+ </a-form-item>
+ </a-col>
+ <a-col :span="6">
+ <a-form-item label="鏃堕棿" :labelCol="labelCol" :wrapperCol="wrapperCol">
+ <div class="params_time">
+ <a-time-picker :open="stratOpen" format="HH:mm" @openChange="timeHandleChange('start')"
+ v-model="queryParams.start">
+ <a-button slot="addon" size="small" type="primary" @click="timeHandleClose('start')">
+ 纭畾
+ </a-button>
+ </a-time-picker>
+ <a-time-picker :open="endOpen" format="HH:mm" @openChange="timeHandleChange('end')"
+ v-model="queryParams.end">
+ <a-button slot="addon" size="small" type="primary" @click="timeHandleClose('end')">
+ 纭畾
+ </a-button>
+ </a-time-picker>
+ </div>
+ </a-form-item>
+ </a-col>
+ <a-col :span="4">
+ <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
+ </a-col>
+ </a-row>
- </a-col>
- <a-col :span="10">
- <a-form-item label="鏃堕棿" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <div class="params_time">
- <a-time-picker :open="stratOpen" format="HH:mm" @openChange="timeHandleChange('start')"
- v-model="queryParams.start">
- <a-button slot="addon" size="small" type="primary" @click="timeHandleClose('start')">
- 纭畾
- </a-button>
- </a-time-picker>
- <a-time-picker :open="endOpen" format="HH:mm" @openChange="timeHandleChange('end')"
- v-model="queryParams.end">
- <a-button slot="addon" size="small" type="primary" @click="timeHandleClose('end')">
- 纭畾
- </a-button>
- </a-time-picker>
- </div>
- </a-form-item>
- </a-col>
- <a-col :span="4">
- <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
- </a-col>
- </a-row>
-
- </div>
- <div class="checkboxgroup">
- <p>缁熻鍙傛暟</p>
- <div class="checkboxgroup_con">
- <a-checkbox-group name="checkboxgroup" :value="option" :options="plainOptions" @change="checkboxOnChange"/>
- </div>
- </div>
-
-
- <a-spin :spinning="spinning">
- <div id="workChart" style="width:85%;height: 500px;"/>
- </a-spin>
</div>
+ <div class="checkboxgroup">
+ <p>缁熻鍙傛暟</p>
+ <div class="checkboxgroup_con">
+ <a-checkbox-group name="checkboxgroup" :value="option" :options="plainOptions" @change="checkboxOnChange"/>
+ </div>
+ </div>
+
+ <a-spin :spinning="spinning">
+ <div id="workChart" style="width:85%;height: 500px;"/>
+ </a-spin>
</a-modal>
</div>
</template>
@@ -312,8 +308,8 @@
boundaryGap: [0, '15%'],
axisLine: {
show: true,
- lineStyle:{
- color:'#5470C6'
+ lineStyle: {
+ color: '#5470C6'
}
}
},
@@ -325,8 +321,8 @@
boundaryGap: [0, '15%'],
axisLine: {
show: true,
- lineStyle:{
- color:'#91CC75'
+ lineStyle: {
+ color: '#91CC75'
}
}
},
@@ -338,8 +334,8 @@
boundaryGap: [0, '15%'],
axisLine: {
show: true,
- lineStyle:{
- color:'#FAC858'
+ lineStyle: {
+ color: '#FAC858'
}
}
}
@@ -376,7 +372,7 @@
temp.push(item)
}
}
- console.log('temp',temp)
+ console.log('temp', temp)
getAction(this.url.workChart, param).then((res) => {
if (JSON.stringify(res.result) == '[]' || res.result == null) {
// this.$message.warning('鏃犳暟鎹紒')
@@ -428,8 +424,8 @@
result.push(line)
}
- console.log('result===========',result)
- console.log('legend=============',lengenddata)
+ console.log('result===========', result)
+ console.log('legend=============', lengenddata)
// option.yAxis = Yarr;
option.series = result
option.legend = lengenddata
@@ -476,51 +472,8 @@
}
}
- /deep/ .ant-modal {
- /*background-color: #000;*/
- /*color: #fff;*/
- }
-
- /deep/ .ant-modal-header {
- /*background-color: #000;*/
- }
-
- /deep/ .ant-modal-title {
- /*color: #fff;*/
- }
-
- /deep/ .ant-modal-close {
- color: #1191b0;
- font-size: 24px;
- }
-
/deep/ .ant-modal-content {
- /*background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.27) 100%);*/
- /*background: -webkit-gradient(linear, left left, right right, color-stop(0%, rgba(0, 0, 0, 0.66)), color-stop(100%, rgba(0, 0, 0, 0.4)));*/
- /*background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
- /*background: -o-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
- /*background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
- /*background: linear-gradient(to right, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
- /*background-color: #000;*/
- /*color: #fff;*/
position: relative;
- }
-
- /deep/ .ant-modal-header {
- /*border-bottom: none!important;*/
- }
-
- /deep/ .ant-checkbox-wrapper {
- /*color: #fff;*/
- }
-
- /deep/ .ant-form-item-label label {
- /*color: #fff;*/
- }
-
- /deep/ .ant-btn {
- /*position: absolute;*/
-
}
.checkboxgroup {
diff --git a/src/views/mdc/base/modules/DeviceLog/WorkHistoryModel.vue b/src/views/mdc/base/modules/DeviceLog/WorkHistoryModel.vue
index 44f7cef..a5682c5 100644
--- a/src/views/mdc/base/modules/DeviceLog/WorkHistoryModel.vue
+++ b/src/views/mdc/base/modules/DeviceLog/WorkHistoryModel.vue
@@ -1,166 +1,167 @@
<template>
<div ref="workHistory">
- <a-modal :title="title" width="80%" :getContainer="() => this.$refs.workHistory" wrap-class-name="full-modal" :visible="visible"
- @cancel="handleCancel" cancelText="鍏抽棴" :footer="null">
- <div>
- <div class="his_params">
- <a-form layout="inline">
- <a-form-item label="璁惧缂栧彿">
- <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" :readOnly="true" v-model="queryParams.equipmentId"></a-input>
- </a-form-item>
- <a-form-item label="璁惧鍚嶇О">
- <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" :readOnly="true" v-model="queryParams.equipmentName"></a-input>
- </a-form-item>
- <a-form-item label="鏃ユ湡">
- <a-range-picker v-model="dates" :disabledDate="disabledDate" @change="dateParamChange" format='YYYY-MM-DD'/>
- </a-form-item>
- <a-button type="primary" @click="queryCharts" icon="search">鏌ヨ</a-button>
- </a-form>
- </div>
- <div style="width: 100%;border: none;" align="center">
- <table cellpadding="0" cellspacing="0" width="100%">
- <tr>
- <td>
- <table width="100%">
- <tr style="word-break: keep-all;">
- <td width="100%" height="100%">
- <table width="100%" height="100%" align="center" cellpadding="0" cellspacing="0" style="border-collapse:separate; border-spacing:10px;">
- <tr v-for="info in listInfo" >
- <td align="left">{{info.date}}</td>
- <td style="word-break: keep-all;" align="left">
- <div
- style="width: 100%; height: 62px;border: 1px solid;border-color: #9d9d9d;position: relative">
- <div class="mdcLogShowOne"
- :style='{display: "inline-block",width:item.dateProportion, height: "100%"}'
- v-for="item in info.value.normal">
+ <a-modal :title="title" width="80%" :getContainer="() => this.$refs.workHistory" wrap-class-name="full-modal"
+ :visible="visible"
+ @cancel="handleCancel" cancelText="鍏抽棴" :footer="null">
+ <div>
+ <div class="his_params">
+ <a-form layout="inline">
+ <a-form-item label="璁惧缂栧彿">
+ <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" :readOnly="true" v-model="queryParams.equipmentId"></a-input>
+ </a-form-item>
+ <a-form-item label="璁惧鍚嶇О">
+ <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" :readOnly="true" v-model="queryParams.equipmentName"></a-input>
+ </a-form-item>
+ <a-form-item label="鏃ユ湡">
+ <a-range-picker v-model="dates" :disabledDate="disabledDate" @change="dateParamChange"
+ format='YYYY-MM-DD'/>
+ </a-form-item>
+ <a-button type="primary" @click="queryCharts" icon="search">鏌ヨ</a-button>
+ </a-form>
+ </div>
+ <div style="width: 100%;border: none;" align="center">
+ <table cellpadding="0" cellspacing="0" width="100%">
+ <tr>
+ <td>
+ <table width="100%">
+ <tr style="word-break: keep-all;">
+ <td width="100%" height="100%">
+ <table width="100%" height="100%" align="center" cellpadding="0" cellspacing="0"
+ style="border-collapse:separate; border-spacing:10px;">
+ <tr v-for="info in listInfo">
+ <td align="left">{{info.date}}</td>
+ <td style="word-break: keep-all;" align="left">
+ <div
+ style="width: 100%; height: 62px;border: 1px solid;border-color: #9d9d9d;position: relative">
+ <div class="mdcLogShowOne"
+ :style='{display: "inline-block",width:item.dateProportion, height: "100%"}'
+ v-for="item in info.value.normal">
<span v-if="item.status == 0"
:style='{display: "inline-block",width:item.dateProportion, height: "100%", background: "#A8A8A8",position:"absolute",top:"0"}'></span>
- <span v-if="item.status == 1"
- :style='{display: "inline-block",width:item.dateProportion, height: "100%", background: "#fffc5c",position:"absolute",top:"0"}'></span>
- <span v-if="item.status == 2"
- :style='{display: "inline-block",width:item.dateProportion, height: "100%", background: "#fffc5c",position:"absolute",top:"0"}'></span>
- <span v-if="item.status == 3"
- :style='{display: "inline-block",width:item.dateProportion, height: "100%", background: "#19FE01",position:"absolute",top:"0"}'></span>
- <span v-if="item.status == 23"
- :style='{display: "inline-block",width:item.dateProportion, height: "100%", background: "#19FE01",position:"absolute",bottom:"0"}'></span>
- </div>
- <div style="z-index: 999;"
- :style='{display: "inline-block",left:item.left,width:item.dateProportion, height: "100%",position:"absolute"}'
- v-for="item in info.value.waring">
+ <span v-if="item.status == 1"
+ :style='{display: "inline-block",width:item.dateProportion, height: "100%", background: "#fffc5c",position:"absolute",top:"0"}'></span>
+ <span v-if="item.status == 2"
+ :style='{display: "inline-block",width:item.dateProportion, height: "100%", background: "#fffc5c",position:"absolute",top:"0"}'></span>
+ <span v-if="item.status == 3"
+ :style='{display: "inline-block",width:item.dateProportion, height: "100%", background: "#19FE01",position:"absolute",top:"0"}'></span>
+ <span v-if="item.status == 23"
+ :style='{display: "inline-block",width:item.dateProportion, height: "100%", background: "#19FE01",position:"absolute",bottom:"0"}'></span>
+ </div>
+ <div style="z-index: 999;"
+ :style='{display: "inline-block",left:item.left,width:item.dateProportion, height: "100%",position:"absolute"}'
+ v-for="item in info.value.waring">
<span
:style='{display: "inline-block",width:"100%", left:0, height: "68%", background: "#FD0008",position:"absolute",bottom:"0"}'></span>
+ </div>
+ <div style="z-index: 1000;"
+ :style='{display: "inline-block",left:item.left,width:item.dateProportion, height: "100%",position:"absolute"}'
+ v-for="item in info.value.fault">
+ <span
+ :style='{display: "inline-block",width:"100%", left:0, height: "50%", background: "#C11900",position:"absolute",bottom:"0"}'></span>
+ </div>
</div>
- </div>
- </td>
- </tr>
- <tr>
- <td align="right">0</td>
- <td width="95%">
- <table width="100%;" cellpadding="0" cellspacing="0">
- <tr align="right" style="word-break: keep-all;">
- <td>02:00</td>
- <td>04:00</td>
- <td>06:00</td>
- <td>08:00</td>
- <td>10:00</td>
- <td>12:00</td>
- <td>14:00</td>
- <td>16:00</td>
- <td>18:00</td>
- <td>20:00</td>
- <td>22:00</td>
- <td>24:00</td>
- </tr>
- </table>
- </td>
- </tr>
- </table>
- </td>
- </tr>
- </table>
- </td>
- </tr>
+ </td>
+ </tr>
+ <tr>
+ <td align="right">0</td>
+ <td width="95%">
+ <table width="100%;" cellpadding="0" cellspacing="0">
+ <tr align="right" style="word-break: keep-all;">
+ <td>02:00</td>
+ <td>04:00</td>
+ <td>06:00</td>
+ <td>08:00</td>
+ <td>10:00</td>
+ <td>12:00</td>
+ <td>14:00</td>
+ <td>16:00</td>
+ <td>18:00</td>
+ <td>20:00</td>
+ <td>22:00</td>
+ <td>24:00</td>
+ </tr>
+ </table>
+ </td>
+ </tr>
+ </table>
+ </td>
+ </tr>
+ </table>
+ </td>
+ </tr>
- </table>
+ </table>
+ </div>
</div>
- </div>
- </a-modal>
+ </a-modal>
</div>
</template>
<script>
import moment from 'moment'
- import * as echarts from 'echarts'
- import {
- getAction,
- postAction
- } from '@/api/manage'
- import {
- duplicateCheck
- } from '@/api/api'
+ import { getAction } from '@/api/manage'
export default {
name: 'WorkHistoryModel',
- components: {},
- props: { waring:[],},
data() {
return {
title: '',
listInfo: [],
dates: [],
- node: {},
-
- stratOpen: false,
- endOpen: false,
visible: false,
- show: false,
queryParams: {},
url: {
logCharts: '/mdc/mdcEquipmentRunningSection/logCharts'
}
}
},
- mounted() {
- },
methods: {
- disabledDate(current){
- return current && current > moment().subtract('days', 1);
+ disabledDate(current) {
+ return current && current > moment().subtract('days', 1)
},
queryCharts() {
let _this = this
- getAction(this.url.logCharts, this.queryParams).then((res) => {
- if (res.success) {
- for (let i = 0; i < res.result.length; i++) {
- let tmp = res.result[i].value
- // console.log(tmp)
- if (tmp) {
- if (tmp.normal) {
- for (let k = 0; k < tmp.normal.length; k++) {
- tmp.normal[k].dateProportion = tmp.normal[k].duration / 86400 * 100 + '%'
- // let leftTmp = (moment(tmp.normal[i].startTime, 'YYYY-MM-DD HH:mm:ss').valueOf() - 57600000) / 1000 % 86400
- // tmp.normal[i].left = leftTmp / 86400 * 100 + '%'
+ this.listInfo = []
+ getAction(this.url.logCharts, this.queryParams)
+ .then((res) => {
+ if (res.success) {
+ for (let i = 0; i < res.result.length; i++) {
+ let tmp = res.result[i].value
+ if (tmp) {
+ if (tmp.normal) {
+ for (let k = 0; k < tmp.normal.length; k++) {
+ tmp.normal[k].dateProportion = tmp.normal[k].duration / 86400 * 100 + '%'
+ }
+ } else {
+ tmp.normal = []
}
- } else {
- tmp.normal = []
- }
- if (tmp.waring) {
- // console.log("娴嬭瘯鍒ゆ柇")
- for (let j = 0; j < tmp.waring.length; j++) {
- tmp.waring[j].dateProportion = tmp.waring[j].duration / 86400 * 100 + '%'
- let leftTmp = (moment(tmp.waring[j].startTime, 'YYYY-MM-DD HH:mm:ss').valueOf() - 57600000) / 1000 % 86400
- tmp.waring[j].left = leftTmp / 86400 * 100 + '%'
+ if (tmp.waring) {
+ for (let j = 0; j < tmp.waring.length; j++) {
+ tmp.waring[j].dateProportion = tmp.waring[j].duration / 86400 * 100 + '%'
+ let leftTmp = (moment(tmp.waring[j].startTime, 'YYYY-MM-DD HH:mm:ss').valueOf() - 57600000) / 1000 % 86400
+ tmp.waring[j].left = leftTmp / 86400 * 100 + '%'
+ }
+ } else {
+ tmp.waring = []
}
- } else {
- tmp.waring = []
+ if (tmp.fault) {
+ for (let j = 0; j < tmp.fault.length; j++) {
+ tmp.fault[j].dateProportion = tmp.fault[j].duration / 86400 * 100 + '%'
+ let leftTmp = (moment(tmp.fault[j].startTime, 'YYYY-MM-DD HH:mm:ss').valueOf() - 57600000) / 1000 % 86400
+ tmp.fault[j].left = leftTmp / 86400 * 100 + '%'
+ }
+ } else {
+ tmp.fault = []
+ }
}
- } else {
- res.result[i].value = { normal: [], waring: [] }
+ else {
+ res.result[i].value = { normal: [], waring: [], fault: [] }
+ }
}
+ _this.listInfo = res.result
}
- _this.listInfo = res.result
- }
- })
+ })
},
dateParamChange(v1, v2) {
this.queryParams.startTime = v2[0]
@@ -169,7 +170,6 @@
add(node) {
let _this = this
this.visible = true
- this.node = node
this.queryParams = {
equipmentId: node.equipmentId,
equipmentName: node.equipmentName
@@ -183,79 +183,8 @@
},
handleCancel() {
this.visible = false
- },
- close() {
- this.visible = false
- this.show = false
}
}
}
</script>
-<style scoped lang="less">
- .full-modal {
- .ant-modal {
- max-width: 100%;
- top: 0;
- padding-bottom: 0;
- margin: 0;
- }
- .ant-modal-content {
- display: flex;
- flex-direction: column;
- height: calc(100vh);
- }
- .ant-modal-body {
- flex: 1;
- }
- }
- /deep/ .ant-modal{
- /*background-color: #000;*/
- /*color: #fff;*/
- }
- /deep/ .ant-modal-header{
- /*background-color: #000;*/
- }
- /deep/ .ant-modal-title{
- /*color: #fff;*/
- }
- /deep/ .ant-modal-close{
- color: #1191b0;
- font-size: 24px;
- }
- /deep/ .ant-modal-content{
- /*background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.27) 100%);*/
- /*background: -webkit-gradient(linear, left left, right right, color-stop(0%, rgba(0, 0, 0, 0.66)), color-stop(100%, rgba(0, 0, 0, 0.4)));*/
- /*background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
- /*background: -o-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
- /*background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
- /*background: linear-gradient(to right, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
- /*background-color: #000;*/
- /*color: #fff;*/
- position: relative;
- }
- /deep/ .ant-modal-header{
- /*border-bottom: none!important;*/
- }
- /deep/ .ant-form-item-label label{
- /*color: #fff;*/
- }
- /*.ant-btn {*/
- /*padding: 0 10px;*/
- /*margin-left: 3px;*/
- /*}*/
-
- /*.ant-form-item-control {*/
- /*line-height: 0px;*/
- /*}*/
-
- /*!** 涓昏〃鍗曡闂磋窛 *!*/
- /*.ant-form .ant-form-item {*/
- /*margin-bottom: 10px;*/
- /*}*/
-
- /*!** Tab椤甸潰琛岄棿璺� *!*/
- /*.ant-tabs-content .ant-form-item {*/
- /*margin-bottom: 0px;*/
- /*}*/
-</style>
diff --git a/src/views/mdc/base/modules/DeviceLog/WorkLogList.vue b/src/views/mdc/base/modules/DeviceLog/WorkLogList.vue
index badd7f4..2d4e1f2 100644
--- a/src/views/mdc/base/modules/DeviceLog/WorkLogList.vue
+++ b/src/views/mdc/base/modules/DeviceLog/WorkLogList.vue
@@ -1,46 +1,28 @@
<template>
- <a-card :bordered="false">
- <!-- table鍖哄煙-begin -->
- <div class="table_workLogist">
- <a-table ref="table" bordered size="middle" :rowKey="(record,index)=>{return index}" :columns="columns"
- :dataSource="dataList" :pagination="false" :loading="loadingrunStatus">
- <template slot="status" slot-scope="status">
- <div v-if="status == '3' || status == '23'" style="color: #00ee00;width: 100%; height: 100%;">杩愯</div>
- <div v-else-if="status == '1' || status == '2'" style="color: #ffea91;width: 100%; height: 100%;">寰呮満</div>
- <div v-else-if="status == '0'" style="color: #A8A8A8;width: 100%; height: 100%;">鍏虫満</div>
- <div v-else-if="status == '22'" style="color: red;width: 100%; height: 100%;">鎶ヨ</div>
- </template>
- </a-table>
- </div>
- </a-card>
+ <div class="table_workLogist">
+ <a-table ref="table" bordered :rowKey="(record,index)=>{return index}" :columns="columns"
+ :dataSource="dataList" :pagination="false" :loading="loading">
+ <template slot="status" slot-scope="status">
+ <div v-if="status == '3' || status == '23'" style="color: #00ee00;width: 100%; height: 100%;">杩愯</div>
+ <div v-else-if="status == '1' || status == '2'" style="color: #ffea91;width: 100%; height: 100%;">寰呮満</div>
+ <div v-else-if="status == '0'" style="color: #A8A8A8;width: 100%; height: 100%;">鍏虫満</div>
+ <div v-else-if="status == '22'" style="color: red;width: 100%; height: 100%;">鎶ヨ</div>
+ </template>
+ </a-table>
+ </div>
</template>
<script>
- import JDictSelectTag from '@/components/dict/JDictSelectTag'
- import {
- requestPut,
- deleteAction
- } from '@/api/manage'
- import JInput from '@/components/jeecg/JInput'
- import JEllipsis from '@/components/jeecg/JEllipsis'
- import Tooltip from 'ant-design-vue/es/tooltip'
-
export default {
name: 'WorkLogList',
- components: {
- Tooltip,
- JDictSelectTag,
- JInput,
- JEllipsis
- },
props: {
dataList: {
type: Array,
required: true,
default: []
},
- loadingrunStatus:{
- type:Boolean,
+ loading: {
+ type: Boolean,
default: false
}
},
@@ -58,62 +40,47 @@
{
title: '寮�濮嬫椂闂�',
align: 'center',
- dataIndex: 'startTime',
- // defaultSortOrder:'descend',
- // sorter: (a, b) => {return a.startTime>b.startTime?1:-1}
+ dataIndex: 'startTime'
},
{
title: '缁撴潫鏃堕棿',
align: 'center',
- dataIndex: 'endTime',
- // defaultSortOrder:'descend',
- // sorter: (a, b) => {return a.endTime>b.endTime?1:-1}
+ dataIndex: 'endTime'
},
{
title: '鎸佺画鏃堕棿',
align: 'center',
dataIndex: 'duration',
- customRender:(t,r,index) =>{
- // console.log(t)
+ customRender: (t, r, index) => {
var ss = parseInt(t)
- if(ss>=3600){
+ if (ss >= 3600) {
// 鏍规嵁绉掓暟杞崲鎴愬搴旂殑鏃跺垎绉�
const hour = parseInt(ss / 3600) < 10 ? '0' + parseInt(ss / 3600) : parseInt(ss / 3600)
const min = parseInt(ss % 3600 / 60) < 10 ? '0' + parseInt(ss % 3600 / 60) : parseInt(ss % 3600 / 60)
const sec = parseInt(ss % 3600 % 60) < 10 ? '0' + parseInt(ss % 3600 % 60) : parseInt(ss % 3600 % 60)
- if(min == '00') {
- if(sec == '00'){
+ if (min == '00') {
+ if (sec == '00') {
return hour + '灏忔椂'
- }else{
- return hour + '灏忔椂'+ sec + '绉�'
+ } else {
+ return hour + '灏忔椂' + sec + '绉�'
}
- }else{
- if(sec == '00') {
+ } else {
+ if (sec == '00') {
return hour + '灏忔椂' + min + '鍒�'
- }else{
+ } else {
return hour + '灏忔椂' + min + '鍒�' + sec + '绉�'
}
}
- // if(sec == '00'){
- // return hour + '灏忔椂' + min + '鍒�'
- // }
- // if(min == '00' && sec == '00'){
- // return hour + '灏忔椂'
- // }
- // return hour + '灏忔椂' + min + '鍒�' + sec + '绉�'
-
- }else if(60<ss && ss<3600){
+ } else if (60 < ss && ss < 3600) {
const min1 = parseInt(ss % 3600 / 60) < 10 ? '0' + parseInt(ss % 3600 / 60) : parseInt(ss % 3600 / 60)
const sec1 = parseInt(ss % 3600 % 60) < 10 ? '0' + parseInt(ss % 3600 % 60) : parseInt(ss % 3600 % 60)
- return min1 + '鍒�' + sec1 + "绉�"
- }else{
+ return min1 + '鍒�' + sec1 + '绉�'
+ } else {
const sec2 = parseInt(ss % 3600 % 60) < 10 ? '0' + parseInt(ss % 3600 % 60) : parseInt(ss % 3600 % 60)
return sec2 + '绉�'
}
}
- // defaultSortOrder:'descend',
- // sorter: (a, b) => {return a.duration>b.duration?1:-1}
},
{
title: '绋嬪簭鍙�',
@@ -122,44 +89,43 @@
}
]
}
- },
- methods: {},
- created() {
}
-
}
</script>
<style lang="less" scoped>
- @import '~@assets/less/common.less';
- @media screen and (min-width: 1920px){
- .table_workLogist{
- height: 417px!important;
- overflow: scroll;
+ @media screen and (min-width: 1920px) {
+ .table_workLogist {
+ height: 417px !important;
+ overflow: auto;
}
}
- @media screen and (min-width: 1680px) and (max-width: 1920px){
- .table_workLogist{
- height: 417px!important;
- overflow: scroll;
+
+ @media screen and (min-width: 1680px) and (max-width: 1920px) {
+ .table_workLogist {
+ height: 417px !important;
+ overflow: auto;
}
}
- @media screen and (min-width: 1400px) and (max-width: 1680px){
- .table_workLogist{
- height: 266px!important;
- overflow: scroll;
+
+ @media screen and (min-width: 1400px) and (max-width: 1680px) {
+ .table_workLogist {
+ height: 266px !important;
+ overflow: auto;
}
}
- @media screen and (min-width: 1280px) and (max-width: 1400px){
- .table_workLogist{
- height: 360px!important;
- overflow: scroll;
+
+ @media screen and (min-width: 1280px) and (max-width: 1400px) {
+ .table_workLogist {
+ height: 360px !important;
+ overflow: auto;
}
}
- @media screen and (max-width: 1280px){
- .table_workLogist{
- height: 170px!important;
- overflow: scroll;
+
+ @media screen and (max-width: 1280px) {
+ .table_workLogist {
+ height: 170px !important;
+ overflow: auto;
}
}
</style>
--
Gitblit v1.9.3