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/openRateFractionAnalysis/openRateFractionAnalysisMain.vue | 321 +++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 238 insertions(+), 83 deletions(-) diff --git a/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue b/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue index 0f05931..8aff73a 100644 --- a/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue +++ b/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue @@ -5,25 +5,107 @@ <div class="table-page-search-wrapper"> <a-form layout="inline" @keyup.enter.native="searchQuery"> <a-row :gutter="24"> - <a-col :md="7" :sm="7"> + <a-col :md="6" :sm="6"> + <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="6" :sm="6"> <a-form-item label="鏃堕棿"> <a-range-picker @change="dateParamChange" :disabledDate="disabledDate" format="YYYYMMDD" v-model="dates" :allowClear="false"/> </a-form-item> </a-col> - <a-col :md="17" :sm="17" :xs="17"> + + <a-col :md="9" :sm="9" :xs="9"> <a-form-item label="鏃堕棿娈�"> <a-space> <a-time-picker :default-value="moment('00:00', 'HH:mm')" format="HH:mm" @change="onChangeStart" :allowClear="false"/> 鑷� <a-time-picker :default-value="moment('08:00', 'HH:mm')" format="HH:mm" @change="onChangeEnd" :allowClear="false"/> <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> + <a-button type="primary" @click="searchReset" icon="reload">閲嶇疆</a-button> </a-space> + </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="6" :sm="6"> + <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="6" :sm="6" :xs="6"> + <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="queryParam.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-form> </div> + <div id="DeviceList"> <a-spin :spinning="loading"> <div id="Efficiency" class="container" style="margin-bottom: 15px;"> @@ -69,16 +151,13 @@ <script> import moment from 'moment' - import { putAction, getAction } from '@/api/manage' + import { getAction } from '@/api/manage' import $ from 'jquery' import '@/components/table2excel/table2excel' import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api' - import { - JeecgListMixin - } from '@/mixins/JeecgListMixin' + import api from '@api/mdc' export default { - // mixins: [JeecgListMixin], name: 'openRateFractionAnalysisMain', data() { return { @@ -92,9 +171,17 @@ TreeIDTwo: 2, deviceTypeDict: '', dates: [], + equipmentTypeList: [], + driveTypeList: [], + device_level_list: [], + device_importance_level_list: [], identifying: [], queryParam: {}, - queryParams: {}, + queryParams: { + equipmentType: [], + driveType: [], + deviceLevel: [] + }, queryParamEquip: {}, queryParamPeople: {}, efficiencyOptions: [ @@ -109,14 +196,16 @@ dataList: [], url: { efficiencyList: '/mdc/efficiencyReport/utilizationRateSectionAnalyze', - listByType: '/mdc/MdcUtilizationRate/getByType' + listByType: '/mdc/MdcUtilizationRate/getByType', + queryEquipmentType: '/mdc/mdcEquipmentType/queryEquipmentType' }, tableHeads: [], XData: [0], YData: [0], isLazyRequest: '',// 鏄惁寮�鍚噿鍔犺浇 - requestAlldataSize: 8,// 鎬诲叡璇锋眰鐨勫垪琛ㄩ」鏁扮洰 - everyRequestDataSize: 15// 姣忔璇锋眰鐨勫垪琛ㄩ」鏁扮洰 + requestAllDataSize: 8,// 鎬诲叡璇锋眰鐨勫垪琛ㄩ」鏁扮洰 + everyRequestDataSize: 15,// 姣忔璇锋眰鐨勫垪琛ㄩ」鏁扮洰 + toggleSearchStatus:false } }, props: { nodeTree: '', Type: '', nodePeople: '' }, @@ -124,13 +213,11 @@ * 鐢熷懡鍛ㄦ湡 鎸傝浇鍓� * */ created() { - this.dates = [moment().subtract('days', 8), moment().subtract('days', 1)] - this.queryParam.startDate = moment(this.dates[0]).format('YYYYMMDD') - this.queryParam.endDate = moment(this.dates[1]).format('YYYYMMDD') - this.queryParam.startTime = '00:00' - this.queryParam.endTime = '08:00' - this.queryParam.typeTree = '1' - this.loadData1() + this.searchReset() + this.queryGroup() + this.getDriveTypeByApi() + this.initDictData('device_level') + this.initDictData('device_importance_level') }, mounted() { @@ -182,22 +269,69 @@ } }, methods: { - moment, - onChangeStart(time, timeString) { - this.queryParam.startTime = timeString - // console.log(time, timeString); + 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 + }) + } + }) }, - onChangeEnd(time, timeString) { - this.queryParam.endTime = timeString - // console.log(time, timeString); + + // 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷 + getDriveTypeByApi() { + api.getDriveTypeApi().then((res) => { + if (res.success) this.driveTypeList = res.result + }) }, - numBerTwo(value) { - if (value) { - return parseFloat((value * 100).toFixed(2)) - } else { - return '0' + + 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 + } + }) }, + + loadData() { + this.loading = true + this.tableHeads = [] + this.dataList = [] + // 鑻ユ棩鏈熼�夋嫨鍣ㄨ缃殑鏌ヨ璇锋眰鏁伴噺瓒呰繃15鏉″垯寮�鍚噿鍔犺浇 + if (this.requestAllDataSize > 15) { + // 寮�鍚噿鍔犺浇鍚庡皢缁撴潫鏃ユ湡璁剧疆涓哄紑濮嬫棩鏈熶箣鍚庣殑14澶╋紝鍗冲厛鏌ヨ15澶╁唴鐨勬暟鎹� + this.queryParam.endDate = moment(this.queryParam.startDate).add(this.everyRequestDataSize - 1, 'days').format('YYYYMMDD') + this.isLazyRequest = true + this.tableScroll.removeEventListener('scroll', this.tableScrollX) // 涓洪伩鍏嶆粴鍔ㄦ潯鏈夋粴鍔ㄨ窛绂诲悗鍚庣偣鍑绘煡璇㈡寜閽Е鍙戞粴鍔ㄤ簨浠讹紝鍥犳鍦ㄨЕ鍙戜簨浠跺墠绉婚櫎浜嬩欢 + } + getAction(this.url.efficiencyList, this.queryParam).then(res => { + if (res.success) { + this.tableHeads = res.result.dates + this.dataList = res.result.mdcEfficiencyList + this.draw() + this.tableScroll.addEventListener('scroll', this.tableScrollX) + } + }).finally(() => { + this.loading = false + }) + }, + TableDraw(key, val) { this.XData = [0] this.YData[0] @@ -209,63 +343,10 @@ } this.XData = Xarr this.YData = Yarr - // if(this.openRateTrendAnalysisChart !=null && this.openRateTrendAnalysisChart != '' && this.openRateTrendAnalysisChart != undefined){ - // this.openRateTrendAnalysisChart.dispose() - // } this.draw() }, - //Can not slect days before today and today - disabledDate(current) { - return current && current > moment().subtract('days', 1) - }, - dateParamChange(v1, v2) { - this.queryParam.startDate = v2[0] - this.queryParam.endDate = v2[1] - this.dates = [v1[0], v1[1]] - }, - searchQuery() { - // 鍥犺Е搴曞埛鏂颁細淇敼鍙傛暟鏃堕棿鍊硷紝鏁呭湪姝ょ敤鏃堕棿閫夋嫨鍣ㄧ殑鏃堕棿鍊煎鍙傛暟鏃堕棿鍊煎啀娆¤祴鍊硷紝鑻ヤ笉杩欐牱鍋氬垯鍙傛暟鏃堕棿鍊煎垯浼氫笌鏃堕棿閫夋嫨鍣ㄤ笂鐨勬椂闂村�间笉涓�鑷� - this.queryParam.startDate = moment(this.dates[0]).format('YYYYMMDD') - this.queryParam.endDate = moment(this.dates[1]).format('YYYYMMDD') - if (this.queryParam.typeTree == '1') { - this.queryParam.parentId = this.queryParamEquip.parentId - this.queryParam.equipmentId = this.queryParamEquip.equipmentId - } else { - this.queryParam.parentId = this.queryParamPeople.parentId - this.queryParam.equipmentId = '' - } - this.requestAlldataSize = moment.duration(moment(this.queryParam.endDate) - moment(this.queryParam.startDate), 'millisecond').asDays() + 1 - this.loadData1() - }, - loadData1() { - this.loading = true - this.tableHeads = [] - this.dataList = [] - // 鑻ユ棩鏈熼�夋嫨鍣ㄨ缃殑鏌ヨ璇锋眰鏁伴噺瓒呰繃15鏉″垯寮�鍚噿鍔犺浇 - if (this.requestAlldataSize > 15) { - // 寮�鍚噿鍔犺浇鍚庡皢缁撴潫鏃ユ湡璁剧疆涓哄紑濮嬫棩鏈熶箣鍚庣殑14澶╋紝鍗冲厛鏌ヨ15澶╁唴鐨勬暟鎹� - this.queryParam.endDate = moment(this.queryParam.startDate).add(this.everyRequestDataSize - 1, 'days').format('YYYYMMDD') - this.isLazyRequest = true - this.tableScroll.removeEventListener('scroll', this.tableScrollX) // 涓洪伩鍏嶆粴鍔ㄦ潯鏈夋粴鍔ㄨ窛绂诲悗鍚庣偣鍑绘煡璇㈡寜閽Е鍙戞粴鍔ㄤ簨浠讹紝鍥犳鍦ㄨЕ鍙戜簨浠跺墠绉婚櫎浜嬩欢 - } - getAction(this.url.efficiencyList, this.queryParam).then(res => { - if (res.success) { - this.tableHeads = res.result.dates - this.dataList = res.result.mdcEfficiencyList - this.draw() - // this.checkSameData(this.dataList) - // this.checkSameData1(this.dataList) - // this.checkSameData2(this.dataList) - // this.combineCell(); - // this.initDeviceType(this.dataList) - this.tableScroll.addEventListener('scroll', this.tableScrollX) - } - }).finally(() => { - this.loading = false - }) - }, draw() { this.openRateTrendAnalysisChart = this.$echarts.init(document.getElementById('openRateTrendChart'), 'macarons') let openRateTrendChartOptions = { @@ -325,6 +406,80 @@ this.openRateTrendAnalysisChart.setOption(openRateTrendChartOptions, true) }, + searchQuery() { + // 鍥犺Е搴曞埛鏂颁細淇敼鍙傛暟鏃堕棿鍊硷紝鏁呭湪姝ょ敤鏃堕棿閫夋嫨鍣ㄧ殑鏃堕棿鍊煎鍙傛暟鏃堕棿鍊煎啀娆¤祴鍊硷紝鑻ヤ笉杩欐牱鍋氬垯鍙傛暟鏃堕棿鍊煎垯浼氫笌鏃堕棿閫夋嫨鍣ㄤ笂鐨勬椂闂村�间笉涓�鑷� + this.queryParam.startDate = moment(this.dates[0]).format('YYYYMMDD') + this.queryParam.endDate = moment(this.dates[1]).format('YYYYMMDD') + + if (this.queryParam.typeTree == '1') { + this.queryParam.parentId = this.queryParamEquip.parentId + this.queryParam.equipmentId = this.queryParamEquip.equipmentId + } else { + this.queryParam.parentId = this.queryParamPeople.parentId + this.queryParam.equipmentId = '' + } + this.requestAllDataSize = moment.duration(moment(this.queryParam.endDate) - moment(this.queryParam.startDate), 'millisecond').asDays() + 1 + + Object.keys(this.queryParams).forEach(item => { + if (Array.isArray(this.queryParams[item])) { + if (this.queryParams[item].length !== 0) this.queryParam[item] = this.queryParams[item].join() + else delete this.queryParam[item] + } + }) + this.loadData() + }, + + searchReset() { + this.queryParams = { + equipmentType: [], + driveType: [], + deviceLevel: [] + } + this.queryParam = {} + this.dates = [moment().subtract('days', 8), moment().subtract('days', 1)] + this.queryParam.startDate = moment(this.dates[0]).format('YYYYMMDD') + this.queryParam.endDate = moment(this.dates[1]).format('YYYYMMDD') + this.queryParam.startTime = '00:00' + this.queryParam.endTime = '08:00' + this.queryParam.typeTree = '1' + this.loadData() + }, + + selectChange(value, key) { + this.queryParams[key] = value + }, + + onChangeStart(time, timeString) { + this.queryParam.startTime = timeString + // console.log(time, timeString); + }, + + onChangeEnd(time, timeString) { + this.queryParam.endTime = timeString + // console.log(time, timeString); + }, + + numBerTwo(value) { + if (value) { + return parseFloat((value * 100).toFixed(2)) + } else { + return '0' + } + }, + + //Can not slect days before today and today + disabledDate(current) { + return current && current > moment().subtract('days', 1) + }, + + dateParamChange(v1, v2) { + this.queryParam.startDate = v2[0] + this.queryParam.endDate = v2[1] + this.dates = [v1[0], v1[1]] + }, + + moment, + /** * 婊氬姩鏉¤Е搴曞埛鏂拌〃鏍兼暟鎹� */ -- Gitblit v1.9.3