From a751e547d67c4f8e2c6fddf958c1559f792515bd Mon Sep 17 00:00:00 2001 From: lyh <925863403@qq.com> Date: 星期五, 27 六月 2025 16:11:50 +0800 Subject: [PATCH] 添加工作流 --- src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue | 611 ++++++++++++++++++------------------------------------ 1 files changed, 207 insertions(+), 404 deletions(-) diff --git a/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue b/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue index 7150831..5426507 100644 --- a/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue +++ b/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue @@ -6,57 +6,103 @@ <a-form layout="inline" @keyup.enter.native="searchQuery"> <a-row :gutter="24"> <a-col :md="6" :sm="6"> - <a-form-item label="鏃堕棿"> - <a-range-picker @change="dateParamChange" :disabledDate="disabledDate" format="YYYYMMDD" - v-model="dates"/> + <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 :lg="2" :md="3" :sm="3" :xs="3"> - <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> + + <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="3" :sm="3" :xs="3"> + <a-space> + <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> + <a-button type="primary" @click="searchReset" icon="reload">閲嶇疆</a-button> + </a-space> + </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" :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"> <div class="openRateTrendDg"> - <!--<div id="Efficiency" class="container">--> - <!--<div class="table2">--> - <!--<table class="dataContent table" border="1" cellspacing="0" cellpadding="0"--> - <!--style="white-space: nowrap;text-align: left;">--> - <!--<thead>--> - <!--<tr class="thead fixed equipname">--> - <!--<th class="thgu dong1 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;">鎶ヨ鍙�--> - <!--</th>--> - <!--<th class="thgu dong2 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;">--> - <!--鍑虹幇娆℃暟--> - <!--</th>--> - <!--<th class="thgu dong3 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;">--> - <!--鍚堣鎸佺画鏃堕棿--> - <!--</th>--> - <!--<th class="thgu dong4 name" rowspan="2" style="min-width: 100px; max-width: 100px;width: 100px;">--> - <!--鎶ヨ淇℃伅--> - <!--</th>--> - <!--<!–<template v-for="(tableHead, index) in tableHeads">–>--> - <!--<!–<th class="timeth" :colspan="checkedList.length">{{tableHead}}</th>–>--> - <!--<!–</template>–>--> - <!--</tr>--> - <!--</thead>--> - <!--<tbody>--> - <!--<tr class="mathData" v-for="(item, index) in dataList" @click="TableDraw(index,item)">--> - <!--<td class="tdgu kaitou">{{item.alarmCode}}</td>--> - <!--<td class="tdgu1 kaitou">{{item.count}}</td>--> - <!--<td class="tdgu2 kaitou">{{getFormattedTime(item.timeCount)}}--> - <!--<!–<td class="tdgu2 kaitou">{{item.timeCount}}</td>–>--> - <!--<td class="tdgu3 kaitou">{{item.alarmContent}}</td>--> - <!--<!–<template v-for="(tableHead, index) in item.dataList">–>--> - <!--<!–<td :style="{background:tableHead.color }">{{tableHead.utilizationRate | numFilter}}</td>–>--> - <!--<!–</template>–>--> - <!--</tr>--> - <!--</tbody>--> - <!--</table>--> - <!--</div>--> - <!--</div>--> - <!--<a-spin :spinning=""></a-spin>--> <a-table :columns="columns" :data-source="dataList" bordered :pagination="false" :scroll="{y:210}" :customRow="customRow" rowKey="alarmCode" @expand="handleExpandChange" :loading="outerDataLoading" @@ -89,13 +135,11 @@ <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 { ajaxGetDictItems, getDictItemsFromCache } from '@/api/api' + import api from '@api/mdc' const columns = [ { title: '鎶ヨ鍙�', dataIndex: 'alarmCode', key: 'alarmCode', align: 'center' }, @@ -136,7 +180,6 @@ ] export default { - // mixins: [JeecgListMixin], name: 'alarmAnalysisMain', components: {}, data() { @@ -153,9 +196,17 @@ TreeIDTwo: 2, deviceTypeDict: '', dates: [], + equipmentTypeList: [], + driveTypeList: [], + device_level_list: [], + device_importance_level_list: [], identifying: [], queryParam: {}, - queryParams: {}, + queryParams: { + equipmentType: [], + driveType: [], + deviceLevel: [] + }, queryParamEquip: {}, queryParamPeople: {}, efficiencyOptions: [ @@ -172,7 +223,8 @@ efficiencyList: '/mdc/alarmAnalyze/alarmList', listByType: '/mdc/MdcUtilizationRate/getByType', alarmTrend: '/mdc/alarmAnalyze/alarmTrend', - equipmentAlarmList: '/mdc/alarmAnalyze/equipmentAlarmList' + equipmentAlarmList: '/mdc/alarmAnalyze/equipmentAlarmList', + queryEquipmentType: '/mdc/mdcEquipmentType/queryEquipmentType' }, tableHeads: [], pieDate: [0], @@ -180,7 +232,8 @@ YData: [0], columns, innerColumns, - hasRequsetAlarmCodeList: [] + hasRequestAlarmCodeList: [], + toggleSearchStatus: false } }, props: { nodeTree: '', Type: '', nodePeople: '' }, @@ -188,15 +241,18 @@ * 鐢熷懡鍛ㄦ湡 鎸傝浇鍓� * */ 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.typeTree = '1' - this.loadData1() - + this.searchReset() + this.queryGroup() + this.getDriveTypeByApi() + this.initDictData('device_level') + this.initDictData('device_importance_level') }, mounted() { this.drawWrin() + window.addEventListener('resize', this.handleWindowResize) + }, + beforeDestroy() { + window.removeEventListener('resize', this.handleWindowResize) }, watch: { Type(valmath) { @@ -268,6 +324,46 @@ } }, methods: { + 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 + }) + } + }) + }, + + // 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷 + getDriveTypeByApi() { + api.getDriveTypeApi().then((res) => { + if (res.success) this.driveTypeList = res.result + }) + }, + + 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 + } + }) + }, + numBerTwo(value) { if (value) { return parseFloat((value * 100).toFixed(2)) @@ -275,6 +371,7 @@ return '0' } }, + TableDraw(key, val) { let that = this that.echartLoading = true @@ -291,15 +388,6 @@ }) that.XData = res.result.dateCountList.map(item => item.key) that.YData = res.result.dateCountList.map(item => item.count) - - // this.tableHeads = res.result.dates - // this.dataList = res.result - // this.draw() - // this.checkSameData(this.dataList) - // this.checkSameData1(this.dataList) - // this.checkSameData2(this.dataList) - // this.combineCell(); - // this.initDeviceType(this.dataList) that.drawWrin() } }) @@ -313,148 +401,60 @@ //Can not slect days before today and today return current && current > moment().subtract('days', 1) }, - initDeviceType(deviceList) { - let dictCode = 'mdc_equipmentType' - let items = [] - items = getDictItemsFromCache(dictCode) - if (deviceList && items.length > 0) { - for (let a = 0; a < deviceList.length; a++) { - if (items && items.length > 0) { - for (let i = 0; i < items.length; i++) { - if (deviceList[a].equipmentType == items[i].value) { - deviceList[a].equipmentType = items[i].title - } - } - } else { - ajaxGetDictItems(dictCode, null).then((res) => { - if (res.success) { - let items = res.result - for (let i = 0; i < items.length; i++) { - if (deviceList[a].equipmentType == items[i].value) { - deviceList[a].equipmentType = items[i].title - } - } - } - }) - } - } - } - }, + dateParamChange(v1, v2) { this.queryParam.startDate = v2[0] this.queryParam.endDate = v2[1] }, + searchQuery() { - if (this.dates && this.dates.length > 0) { - 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.loadData1() + if (this.queryParam.typeTree == '1') { + this.queryParam.parentId = this.queryParamEquip.parentId + this.queryParam.equipmentId = this.queryParamEquip.equipmentId } else { - this.$notification.warning({ - message: '鎻愮ず', - description: '璇烽�夋嫨鏃堕棿' - }) + this.queryParam.parentId = this.queryParamPeople.parentId + this.queryParam.equipmentId = '' } - // this.onClearSelected() + 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.typeTree = this.queryParam.typeTree - // this.typeParent = this.queryParam.parentId - // this.typeEquipment = this.queryParam.equipmentId - // this.queryParam = {} - // this.dates = [] - // this.queryParam.typeTree = this.typeTree - // this.queryParam.parentId = this.typeParent - // this.queryParam.equipmentId = this.typeEquipment - // // this.ipagination.current = 1 - // this.loadData1(); - // // this.queryParam = {} - // // this.dates = [] - // // this.loadData() - // // this.onClearSelected() - // }, - // loadData1() { - // let that = this - // that.columns=[ - // { - // title: '璁惧缂栧彿', - // align: 'center', - // dataIndex: 'equipmentId', - // width:'150px' - // }, - // { - // title: '璁惧鍚嶇О', - // align: 'center', - // dataIndex: 'equipmentName', - // width:'150px' - // }, - // ] - // that.tableHeads = [] - // that.dataList = [] - // getAction(this.url.efficiencyList, that.queryParam).then(res => { - // var tmp = {} - // console.log(res) - // if (res.success) - // - // that.dataSource = res.result.mdcEfficiencyList - // for(var k = 0;k<that.dataSource[0].dataList.length;k++){ - // that.columns.push( - // { - // title:that.dataSource[0].dataList.theDate, - // align: 'center', - // width:'120px', - // // dataIndex:'utilizationRate', - // } - // ) - // } - // for(var i = 0;i<that.dataSource.length;i++){ - // for (var j = 0; j < that.dataSource[i].dataList.length;j++){ - // // that.columns.push( - // // { - // // title:that.dataSource[0].dataList[j].theDate, - // // align: 'center', - // // width:'120px', - // // dataIndex:'utilizationRate', - // // } - // // ) - // } - // - // } - // console.log(that.columns) - // console.log(that.dataSource) - // // this.initDeviceType(this.dataList) - // this.draw() - // } - // } - loadData1() { + + 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.typeTree = '1' + this.loadData() + }, + + loadData() { this.outerDataLoading = true this.tableHeads = [] this.dataList = [] getAction(this.url.efficiencyList, this.queryParam).then(res => { if (res.success) { - // this.tableHeads = res.result.dates this.dataList = res.result - this.hasRequsetAlarmCodeList = [] - // this.draw() - // this.checkSameData(this.dataList) - // this.checkSameData1(this.dataList) - // this.checkSameData2(this.dataList) - // this.combineCell(); - // this.initDeviceType(this.dataList) - + this.hasRequestAlarmCodeList = [] } }).finally(() => { this.outerDataLoading = false }) }, + drawWrin() { - let equipmentWarningPie = this.$echarts.init(document.getElementById('MdcEquipmentWarningPie'), 'macarons') + this.equipmentWarningPie = this.$echarts.init(document.getElementById('MdcEquipmentWarningPie'), 'macarons') let equipmentWarningPieOption = { title: { text: '鍚勮澶囧嚭鐜版鎶ヨ鐨勬瘮渚�', @@ -493,8 +493,8 @@ // data:[{name:'jjjjjjj',value:'2'}] }] } - equipmentWarningPie.setOption(equipmentWarningPieOption, true) - let equipmentWarningLine = this.$echarts.init(document.getElementById('MdcEquipmentWarningLine'), 'macarons') + this.equipmentWarningPie.setOption(equipmentWarningPieOption, true) + this.equipmentWarningLine = this.$echarts.init(document.getElementById('MdcEquipmentWarningLine'), 'macarons') let equipmentWarningLineOption = { title: { text: '姣忓ぉ鍑虹幇姝ゆ姤璀︾殑鏁伴噺璧板娍', @@ -562,7 +562,7 @@ } ] } - equipmentWarningLine.setOption(equipmentWarningLineOption, true) + this.equipmentWarningLine.setOption(equipmentWarningLineOption, true) }, /** @@ -594,237 +594,40 @@ handleExpandChange(expanded, record) { let _this = this // 褰撳睍寮�鏃惰嫢璇ヨ鏈灞曞紑杩囨墠浼氳姹傚悗鍙版暟鎹紝灞曞紑杩囩殑鏁版嵁浼氳缂撳瓨鏃犻渶閲嶅璇锋眰 - const param = Object.assign({ alarmCode: record.alarmCode }, this.queryParam) - if (expanded && !this.hasRequsetAlarmCodeList.includes(record.alarmCode)) { + this.queryParam.alarmCode = record.alarmCode + if (expanded && !this.hasRequestAlarmCodeList.includes(record.alarmCode)) { this.innerDataLoading = true - getAction(this.url.equipmentAlarmList, param).then(res => { + getAction(this.url.equipmentAlarmList, this.queryParam).then(res => { if (res.success) { _this.dataList.forEach(item => { if (item.alarmCode === record.alarmCode) { item.innerDataList = res.result } }) - _this.hasRequsetAlarmCodeList.push(record.alarmCode) + _this.hasRequestAlarmCodeList.push(record.alarmCode) } }) .finally(() => { _this.innerDataLoading = false }) } + }, + + selectChange(value, key) { + this.queryParams[key] = value + }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize() { + if (this.equipmentWarningPie) this.equipmentWarningPie.resize() + if (this.equipmentWarningLine) this.equipmentWarningLine.resize() } } } </script> <style scoped> - .dataContent { - white-space: nowrap; - /*margin: 0;*/ - /*border: none;*/ - border-collapse: separate; - border-spacing: 0; - /*table-layout: fixed;*/ - border: 1px solid #ccc; - /*border: 1px solid #ccc;*/ - width: 100%; - /*height: 100%;*/ - /*overflow: hidden;*/ - /*overflow-y: auto;*/ - text-align: center; - } - - /*.dataContent .fixed th {*/ - /*width: 50px;*/ - /*}*/ - - .dataContent .thead th { - background-color: #fafafa; - text-align: center; - height: 30px; - padding: 5px; - } - - .dataContent .notfixed th { - /*width: auto;*/ - } - - .dataContent tr td { - height: 35px; - } - - .dataContent .mathData:hover td { - background-color: #e6f7ff; - } - - .dataContent .mathData td { - padding: 10px; - /*display: none;*/ - } - - .dataContent .mathData td { - /*background-color: #ff9bd2;*/ - cursor: pointer; - } - - .dataContent .mathData .tdd { - /*display: none;*/ - } - - .table2 { - width: 100%; - height: 100%; - overflow: auto; - } - - /*tr th {*/ - /*height: 50px!important;*/ - /*}*/ - /*tr td{*/ - /*height: 50px!important;*/ - /*}*/ - .table2 thead tr th:first-child, - .table tbody tr .tdgu { - position: sticky; - left: 0; - z-index: 1; - } - - .table tbody tr .kaitou { - z-index: 1; - background-color: white; - } - - .table tbody tr .tdgu1 { - position: sticky; - left: 150px; - z-index: 2; - } - - .table tbody tr .tdgu2 { - position: sticky; - left: 300px; - z-index: 2; - } - - .table tbody tr .tdgu3 { - position: sticky; - left: 450px; - z-index: 2; - } - - .table tbody tr .tdgu4 { - position: sticky; - left: 550px; - z-index: 2; - } - - .table tbody tr .tdgu5 { - position: sticky; - left: 700px; - z-index: 2; - } - - .table2 thead tr .timeth, - .table2 thead tr .thgu { - position: sticky; - top: 0; - z-index: 3; - } - - .table2 thead .gudingth th { - position: sticky; - top: 32px; - z-index: 6 !important; - } - - .table2 thead .equipname .name { - z-index: 3; - } - - .table2 thead .equipname .dong1 { - z-index: 4; - left: 0; - /*border: 1px solid #000;*/ - } - - .table2 thead .equipname .dong2 { - z-index: 5; - left: 150px; - } - - .table2 thead .equipname .dong3 { - z-index: 5; - left: 300px; - } - - .table2 thead .equipname .dong4 { - z-index: 5; - left: 450px; - } - - .table2 thead .equipname .dong5 { - z-index: 5; - left: 550px; - } - - .table2 thead .equipname .dong6 { - z-index: 5; - left: 700px; - } - - @media screen and (min-width: 1920px) { - #Efficiency { - height: 258px !important; - overflow: scroll; - } - } - - @media screen and (min-width: 1680px) and (max-width: 1920px) { - #Efficiency { - height: 258px !important; - overflow: scroll; - } - } - - @media screen and (min-width: 1400px) and (max-width: 1680px) { - #Efficiency { - height: 160px !important; - overflow: scroll; - } - } - - @media screen and (min-width: 1280px) and (max-width: 1400px) { - #Efficiency { - height: 60px !important; - overflow: scroll; - } - } - - @media screen and (max-width: 1280px) { - #Efficiency { - height: 90px !important; - overflow: scroll; - } - } - - #Efficiency .table_guding1 { - position: absolute; - overflow: hidden; - width: 500px; - } - - #Efficiency .table_guding2 { - overflow-x: scroll; - width: 500px; - } - - /deep/ .ant-card { - height: 100% !important; - } - - /deep/ .ant-card .ant-card-body { - height: 100% !important; - } - .efficiency_list #DeviceList { height: 90% !important; } -- Gitblit v1.9.3