From 3a73cd63039981d1f7cd324afea8f14f37738467 Mon Sep 17 00:00:00 2001
From: zhaowei <zhaowei>
Date: 星期五, 07 三月 2025 11:24:49 +0800
Subject: [PATCH] 1、统计分析和统计图表、对比分析和利用率走势分析、利用率分段分析和报警分析页面新增筛选条件保持跟TEEP页面一致 2、全局中重要程度的筛选方式由多选改为单选 3、设备监控与车间看板页面的设备详情弹窗中的图表调整为一直展示但若无数据则不展示图表的指针与数值
---
src/views/mdc/base/modules/StatisticsChart/StatisticsLegend.vue | 232 +++++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 191 insertions(+), 41 deletions(-)
diff --git a/src/views/mdc/base/modules/StatisticsChart/StatisticsLegend.vue b/src/views/mdc/base/modules/StatisticsChart/StatisticsLegend.vue
index 7cb1658..629f22f 100644
--- a/src/views/mdc/base/modules/StatisticsChart/StatisticsLegend.vue
+++ b/src/views/mdc/base/modules/StatisticsChart/StatisticsLegend.vue
@@ -2,20 +2,98 @@
<div id="StatisticsLegend"
style="width: 100%; height: 100%; overflow: hidden;display: flex;flex-direction: column;background-color: #f5f4f4">
<!-- 鏌ヨ鍖哄煙 -->
- <div style="width: 100%; height: 44px; background-color: #fff" class="table-page-search-wrapper">
+ <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
<a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
<a-col :md="5" :sm="5" :xs="5">
<a-form-item label="鍚嶇О">
- <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" :readOnly="readOnly" v-model="queryParam.tierName"></a-input>
+ <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" readOnly v-model="queryParam.tierName"></a-input>
</a-form-item>
</a-col>
- <a-col :md="4" :sm="4" :xs="4">
+ <a-col :md="5" :sm="5">
+ <a-form-item label="璁惧绫诲瀷">
+ <a-select
+ :value="queryParams.equipmentType"
+ mode="multiple"
+ placeholder="璇烽�夋嫨璁惧绫诲瀷"
+ allow-clear
+ :maxTagCount="1"
+ @change="selectChange($event,'equipmentType')"
+ >
+ <a-select-option v-for="(item,index) in equipmentTypeList" :value="item.value" :key="index">
+ {{item.label}}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+ <a-col :md="7" :sm="7">
+ <a-form-item label="椹卞姩绫诲瀷">
+ <a-select
+ :value="queryParams.driveType"
+ mode="multiple"
+ placeholder="璇烽�夋嫨椹卞姩绫诲瀷"
+ allow-clear
+ :maxTagCount="1"
+ @change="selectChange($event,'driveType')"
+ >
+ <a-select-option v-for="(item,index) in driveTypeList" :value="item.value" :key="index">
+ {{item.label}}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+ <a-col :md="5" :sm="5" :xs="5">
<a-form-item label="鏃ユ湡">
<a-date-picker v-model="queryParams.collectTime" :disabledDate="disabledDate" format='YYYY-MM-DD'
- @change="dataChange" :allowClear="false"/>
+ @change="handleDateChange" :allowClear="false" style="width: 100%"/>
</a-form-item>
</a-col>
+ <a-col :md="2" :sm="2">
+ <a
+ @click="toggleSearchStatus=!toggleSearchStatus"
+ @selectstart="$event.preventDefault()"
+ style="display: inline-block;height: 32px;line-height: 32px"
+ >
+ {{ toggleSearchStatus ? '鏀惰捣' : '灞曞紑' }}
+ <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
+ </a>
+ </a-col>
+ </a-row>
+
+ <a-row :gutter="24" v-if="toggleSearchStatus">
+ <a-col :md="5" :sm="5" :xs="5">
+ <a-form-item label="璁惧绾у埆">
+ <a-select
+ :value="queryParams.deviceLevel"
+ mode="multiple"
+ placeholder="璇烽�夋嫨璁惧绾у埆"
+ allow-clear
+ :maxTagCount="1"
+ @change="selectChange($event,'deviceLevel')"
+ >
+ <a-select-option v-for="(item,index) in device_level_list" :value="item.value" :key="index">
+ {{item.label}}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+
+ <a-col :md="5" :sm="5" :xs="5">
+ <a-form-item label="閲嶈绋嬪害">
+ <a-select
+ v-model="queryParams.deviceImportanceLevel"
+ placeholder="璇烽�夋嫨璁惧閲嶈绋嬪害"
+ allow-clear
+ >
+ <a-select-option v-for="(item,index) in device_importance_level_list" :value="item.value" :key="index">
+ {{item.label}}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+ </a-row>
+
+ <a-row :gutter="24">
<a-col :md="2" :sm="2" :xs="2">
<a-space>
<a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
@@ -92,16 +170,15 @@
<script>
import moment from 'moment'
import { putAction, getAction } from '@/api/manage'
- import $ from 'jquery'
import * as echarts from 'echarts'
+ import api from '@/api/mdc'
+ import { ajaxGetDictItems, getDictItemsFromCache } from '@/api/api'
export default {
name: 'StatisticsLegend',
props: { equip: {} },
data() {
return {
- readOnly: true,
- showday: true,
StatCharOpeningRate: 0,
StatCharUsedRate: 0,
StatCharUsedopeningRate: 0,
@@ -114,16 +191,23 @@
StartupHeight: 0,
quip: {},
dates: [],
+ equipmentTypeList: [],
+ driveTypeList: [],
+ device_level_list: [],
+ device_importance_level_list: [],
queryParam: {},
queryParams: {
+ equipmentType: [],
+ driveType: [],
+ deviceLevel: [],
collectTime: undefined
},
- shiftSubList: [],
- shiftList: [],
+ toggleSearchStatus: false,
url: {
getEquipmentByPid: '/mdc/mdcequipment/getEquipmentByPid',
dayStatisticalRate: '/mdc/efficiencyReport/dayStatisticalRate',
- getBaseTree: '/mdc/mdcEquipment/queryTreeListByProduction'
+ getBaseTree: '/mdc/mdcEquipment/queryTreeListByProduction',
+ queryEquipmentType: '/mdc/mdcEquipmentType/queryEquipmentType'
}
}
},
@@ -132,23 +216,71 @@
this.queryParams.collectTime = moment().add(-1, 'd').format('YYYY-MM-DD')
this.queryParams.dateTime = moment().add(-1, 'd').format('YYYYMMDD')
this.initEquipmentNode()
+ this.queryGroup()
+ this.getDriveTypeByApi()
+ this.initDictData('device_level')
+ this.initDictData('device_importance_level')
},
methods: {
- disabledDate(current) {
- //Can not slect days before today and today
- return current && current > moment().subtract('days', 1)
+ queryGroup() {
+ getAction(this.url.queryEquipmentType).then(res => {
+ if (res.success) {
+ this.equipmentTypeList = res.result.map(item => {
+ return {
+ label: item.equipmentTypeName,
+ value: item.equipmentTypeName
+ }
+ })
+ } else {
+ this.$notification.warning({
+ message: '娑堟伅',
+ description: res.message
+ })
+ }
+ })
},
- //鎶婄璁＄畻鎴愬搴旂殑鏃跺垎绉掔殑鍑芥暟
- getTime(time) {
- //杞崲涓烘椂鍒嗙
- let h = Math.round(time / 60 / 60)
- h = h < 10 ? '0' + h : h
- //浣滀负杩斿洖鍊艰繑鍥�
- // console.log(h);
- return h
+
+ // 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷
+ getDriveTypeByApi() {
+ api.getDriveTypeApi().then((res) => {
+ if (res.success) this.driveTypeList = res.result
+ })
},
- moment,
+
+ initDictData(dictCode) {
+ // //浼樺厛浠庣紦瀛樹腑璇诲彇瀛楀吀閰嶇疆
+ if (getDictItemsFromCache(dictCode)) {
+ this[dictCode + '_list'] = getDictItemsFromCache(dictCode)
+ return
+ }
+ //鏍规嵁瀛楀吀Code, 鍒濆鍖栧瓧鍏告暟缁�
+ ajaxGetDictItems(dictCode, null).then((res) => {
+ if (res.success) {
+ this[dictCode + '_list'] = res.result
+ return
+ }
+ })
+ },
+
+ queryStatistical(queryParams) {
+ getAction(this.url.dayStatisticalRate, queryParams).then(res => {
+ if (res.success) {
+ this.StatCharOpeningRate = res.result.openRate
+ this.StatCharUsedRate = res.result.utilizationRate
+ this.UtilizationHeight = res.result.openRate
+ this.StatCharUsedopeningRate = res.result.usedOpenRate
+ this.StartupHeight = res.result.usedOpenRate
+ this.openingLong = this.getTime(res.result.openLong)
+ this.waitingLong = this.getTime(res.result.waitLong)
+ this.processLong = this.getTime(res.result.processLong)
+ this.closedLong = this.getTime(res.result.closeLong)
+ this.totalLong = parseInt(this.openingLong) + parseInt(this.closedLong)
+ this.draw()
+ }
+ })
+ },
+
draw() {
//鍒╃敤鐜�
//楗煎浘
@@ -579,29 +711,18 @@
}
StartupLine.setOption(StartupLine_option)
},
- queryStatistical() {
- getAction(this.url.dayStatisticalRate, this.queryParams).then(res => {
- if (res.success) {
- this.StatCharOpeningRate = res.result.openRate
- this.StatCharUsedRate = res.result.utilizationRate
- this.UtilizationHeight = res.result.openRate
- this.StatCharUsedopeningRate = res.result.usedOpenRate
- this.StartupHeight = res.result.usedOpenRate
- this.openingLong = this.getTime(res.result.openLong)
- this.waitingLong = this.getTime(res.result.waitLong)
- this.processLong = this.getTime(res.result.processLong)
- this.closedLong = this.getTime(res.result.closeLong)
- this.totalLong = parseInt(this.openingLong) + parseInt(this.closedLong)
- this.draw()
- }
- })
+
+ selectChange(value, key) {
+ this.queryParams[key] = value
},
- dataChange(val) {
+
+ handleDateChange(val) {
if (val) {
this.queryParams.dateTime = val.format('YYYYMMDD')
this.queryParams.collectTime = val.format('YYYY-MM-DD')
}
},
+
initEquipmentNode() {
let _this = this
getAction(this.url.getBaseTree).then((res) => {
@@ -623,7 +744,7 @@
_this.$set(this.queryParams, 'parentId', res.result[0].key)
}
}
- this.queryStatistical()
+ this.queryStatistical(this.queryParams)
} else {
this.$notification.warning({
message: '娑堟伅',
@@ -635,16 +756,45 @@
this.cardLoading = false
})
},
+
searchReset() {
this.queryParam = {}
this.queryParams = {
+ equipmentType: [],
+ driveType: [],
+ deviceLevel: [],
collectTime: moment().add(-1, 'd').format('YYYY-MM-DD'),
dateTime: moment().add(-1, 'd').format('YYYYMMDD')
}
this.initEquipmentNode()
},
+
searchQuery() {
- this.queryStatistical()
+ const queryParams = Object.assign({}, this.queryParams)
+
+ Object.keys(queryParams).forEach(item => {
+ if (Array.isArray(queryParams[item])) {
+ queryParams[item] = queryParams[item].join()
+ // 姝ゅ涓轰繚璇佹帴鍙ｅ弬鏁颁笉澶氫綑锛屽彲鐪佺暐
+ if (queryParams[item].length === 0) delete queryParams[item]
+ }
+ })
+ this.queryStatistical(queryParams)
+ },
+
+ disabledDate(current) {
+ //Can not slect days before today and today
+ return current && current > moment().subtract('days', 1)
+ },
+
+ //鎶婄璁＄畻鎴愬搴旂殑鏃跺垎绉掔殑鍑芥暟
+ getTime(time) {
+ //杞崲涓烘椂鍒嗙
+ let h = Math.round(time / 60 / 60)
+ h = h < 10 ? '0' + h : h
+ //浣滀负杩斿洖鍊艰繑鍥�
+ // console.log(h);
+ return h
}
},
watch: {
--
Gitblit v1.9.3