From 131fa204ba295379a2c5698eee8453a0d81cb8ef Mon Sep 17 00:00:00 2001 From: zhuzhuanzhuan Date: 星期五, 04 八月 2023 18:01:12 +0800 Subject: [PATCH] 日利用率,日利用率对比,利用率走势分析 --- src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue | 507 ++++++++++++++++ src/views/mdc/base/openRateTrendAnalysis.vue | 123 ++++ src/views/mdc/base/equipmentDayAvail.vue | 72 ++ src/views/mdc/base/equipmentAvailCompare.vue | 72 ++ src/views/mdc/base/modules/equipmentAvailCompare/equipmentAvailCompareMain.vue | 481 ++++++++++++++++ src/views/mdc/base/modules/deviceCalendar/DeviceCalendarModel.vue | 2 src/views/mdc/base/modules/deviceLog/LogInfo.vue | 2 src/views/mdc/base/modules/equipmentDayAvail/equipmentDayAvailMain.vue | 483 ++++++++++++++++ 8 files changed, 1,740 insertions(+), 2 deletions(-) diff --git a/src/views/mdc/base/equipmentAvailCompare.vue b/src/views/mdc/base/equipmentAvailCompare.vue new file mode 100644 index 0000000..7a38279 --- /dev/null +++ b/src/views/mdc/base/equipmentAvailCompare.vue @@ -0,0 +1,72 @@ +<template> + <a-card :bordered="false"> + <div style="width: 100%; height: 100%;overflow: hidden"> + <a-row type="flex" :gutter="16"> + <a-col :md="5"> + <a-tabs :activeKey="activeKey" @change="tabChange"> + <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> + <base-tree @getCurrSelected="changeSelectionNode"></base-tree> + </a-tab-pane> + <a-tab-pane key="2" tab="閮ㄩ棬灞傜骇"> + <depart-tree @getCurrSelectedDD="changeSelectionNodedd" + ></depart-tree> + </a-tab-pane> + </a-tabs> + </a-col> + <a-col :md="24-5" :sm="24"> + <equipment-avail-compare-main ref="equipmentDayAvailMain" :nodeTree='selectEquement' :nodePeople='selectPeople' :Type="slectTypeTree"></equipment-avail-compare-main> + </a-col> + </a-row> + </div> + </a-card> +</template> + +<script> + import BaseTree from '../common/BaseTree' + import equipmentAvailCompareMain from './modules/equipmentAvailCompare/equipmentAvailCompareMain' + import DepartTree from './modules/DepartList/DepartListTree/DepartTree' + export default { + name: 'equipmentAvailCompare', + components:{ + BaseTree, + equipmentAvailCompareMain, + DepartTree + }, + data() { + return { + activeKey: '1', + description: '璁惧淇℃伅', + selectEquementId: '', + selectEquement: {}, + selectPeople:{}, + slectTypeTree: '', + url: { + equipmentStatistics: '/mdc/equipment/equipmentStatistics' + } + } + }, + methods: { + tabChange(val) { + // console.log(val) + this.activeKey = val + this.slectTypeTree = val + }, + /* changeSelection(val) { + this.selectEquementId = val + this.$refs.DeviceRepairList.pQuery(val) + },*/ + changeSelectionNode(val) { + this.selectEquement = val + this.slectTypeTree = '1' + }, + changeSelectionNodedd(val) { + this.selectPeople = val + this.slectTypeTree = '2' + } + } + } +</script> + +<style scoped> + +</style> \ No newline at end of file diff --git a/src/views/mdc/base/equipmentDayAvail.vue b/src/views/mdc/base/equipmentDayAvail.vue new file mode 100644 index 0000000..7b67954 --- /dev/null +++ b/src/views/mdc/base/equipmentDayAvail.vue @@ -0,0 +1,72 @@ +<template> + <a-card :bordered="false"> + <div style="width: 100%; height: 100%;overflow: hidden"> + <a-row type="flex" :gutter="16"> + <a-col :md="5"> + <a-tabs :activeKey="activeKey" @change="tabChange"> + <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> + <base-tree @getCurrSelected="changeSelectionNode"></base-tree> + </a-tab-pane> + <a-tab-pane key="2" tab="閮ㄩ棬灞傜骇"> + <depart-tree @getCurrSelectedDD="changeSelectionNodedd" + ></depart-tree> + </a-tab-pane> + </a-tabs> + </a-col> + <a-col :md="24-5" :sm="24"> + <equipment-day-avail-main ref="equipmentDayAvailMain" :nodeTree='selectEquement' :nodePeople='selectPeople' :Type="slectTypeTree"></equipment-day-avail-main> + </a-col> + </a-row> + </div> + </a-card> +</template> + +<script> + import BaseTree from '../common/BaseTree' + import equipmentDayAvailMain from './modules/equipmentDayAvail/equipmentDayAvailMain' + import DepartTree from './modules/DepartList/DepartListTree/DepartTree' + export default { + name: 'equipmentDayAvail', + components:{ + BaseTree, + equipmentDayAvailMain, + DepartTree + }, + data() { + return { + activeKey: '1', + description: '璁惧淇℃伅', + selectEquementId: '', + selectEquement: {}, + selectPeople:{}, + slectTypeTree: '', + url: { + equipmentStatistics: '/mdc/equipment/equipmentStatistics' + } + } + }, + methods: { + tabChange(val) { + // console.log(val) + this.activeKey = val + this.slectTypeTree = val + }, + /* changeSelection(val) { + this.selectEquementId = val + this.$refs.DeviceRepairList.pQuery(val) + },*/ + changeSelectionNode(val) { + this.selectEquement = val + this.slectTypeTree = '1' + }, + changeSelectionNodedd(val) { + this.selectPeople = val + this.slectTypeTree = '2' + } + } + } +</script> + +<style scoped> + +</style> \ No newline at end of file diff --git a/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarModel.vue b/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarModel.vue index 902b674..6a82095 100644 --- a/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarModel.vue +++ b/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarModel.vue @@ -219,7 +219,7 @@ url: { add: '/mdc/mdcDeviceCalendar/add', edit: '/mdc/mdcshiftsub/edit', - initShiftList: '/mdc/mdcMdcShift/deleteShift', + initShiftList: '/mdc/mdcMdcShift/initShiftList', initShiftSubList: '/mdc/mdcshiftsub/initShiftSubList', getShiftSubById: '/mdc/mdcshiftsub/getShiftSubById', settingCalendar: '/mdc/mdcDeviceCalendar/add', diff --git a/src/views/mdc/base/modules/deviceLog/LogInfo.vue b/src/views/mdc/base/modules/deviceLog/LogInfo.vue index 2b990c8..3c48337 100644 --- a/src/views/mdc/base/modules/deviceLog/LogInfo.vue +++ b/src/views/mdc/base/modules/deviceLog/LogInfo.vue @@ -15,7 +15,7 @@ </a-form-item> </a-col> <a-col :md="6" :sm="6"> - <a-form-item label="閲囬泦鏃堕棿"> + <a-form-item label="鏃ユ湡"> <a-date-picker v-model="queryParams.collectTime" :disabledDate="disabledDate" @change="dataChange" format='YYYY-MM-DD'/> </a-form-item> </a-col> diff --git a/src/views/mdc/base/modules/equipmentAvailCompare/equipmentAvailCompareMain.vue b/src/views/mdc/base/modules/equipmentAvailCompare/equipmentAvailCompareMain.vue new file mode 100644 index 0000000..903b3e5 --- /dev/null +++ b/src/views/mdc/base/modules/equipmentAvailCompare/equipmentAvailCompareMain.vue @@ -0,0 +1,481 @@ +<template> + <a-card :bordered="false" class="device_list"> + <div class="com_box"> + <!-- 鏌ヨ鍖哄煙 --> + <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="4" :sm="4"> + <a-form-item label="璁惧缂栧彿"> + <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentId"></a-input> + </a-form-item> + </a-col> + <a-col :md="4" :sm="4"> + <a-form-item label="璁惧鍚嶇О"> + <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentName"></a-input> + </a-form-item> + </a-col> + <a-col :md="5" :sm="5" :xs="5"> + <a-form-item label="鏃堕棿"> + <a-range-picker @change="dateParamChange" v-model="dates" format="YYYYMMDD"/> + </a-form-item> + </a-col> + <a-col :md="7" :sm="7" :xs="7"> + <a-form-item label="鏃堕棿娈�"> + <a-time-picker :default-value="moment('00:00', 'HH:mm')" format="HH:mm" @change="onChangeStart" /> + 鑷� + <a-time-picker :default-value="moment('08:00', 'HH:mm')" format="HH:mm" @change="onChangeEnd" /> + </a-form-item> + </a-col> + <a-col :md="2" :sm="3" :xs="3"> + <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> + </a-col> + <!--<a-col :md="2" :sm="2" :xs="2">--> + <!--<a-button type="primary" @click="searchReset" icon="reload">閲嶇疆</a-button>--> + <!--</a-col>--> + </a-row> + </a-form> + </div> + <!-- table鍖哄煙-begin --> + <div id="DeviceList"> + + <div style="padding: 5px;width: 100%;height: 100%"> + <div style="width: 100%;height: 100%" id="dayAvailBar"></div> + <!--<div id="dayAvailLine"></div>--> + </div> + </div> + <!-- table鍖哄煙-end --> + </div> + </a-card> +</template> + +<script> + import moment from 'moment' + import $ from 'jquery' + import JDictSelectTag from '@/components/dict/JDictSelectTag' + import JDate from '../../../../../components/jeecg/JDate' + import { + requestPut, + deleteAction, + getAction + } from '@/api/manage' + // import comparativeAnalysisBar from './comparativeAnalysisBar' + // import comparativeAnalysisGauge from'./comparativeAnalysisGauge' + // import conparativeAnalysisPie from './conparativeAnalysisPie' + import '@/components/table2excel/table2excel' + import JInput from '@/components/jeecg/JInput' + import JEllipsis from '@/components/jeecg/JEllipsis' + import Tooltip from 'ant-design-vue/es/tooltip' + import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api' + import AFormItem from 'ant-design-vue/es/form/FormItem' + export default { + name: 'equipmentAvailCompareMain', + // mixins: [JeecgListMixin], + components: { + AFormItem, + Tooltip, + // comparativeAnalysisBar, + // comparativeAnalysisGauge, + // conparativeAnalysisPie, + JDictSelectTag, + JInput, + JDate, + JEllipsis + }, + props: { nodeTree: '', Type:'',nodePeople: '' }, + data() { + return { + activeKey: '1', + typeTree:"", + typeParent:1, + typeEquipment:1, + spaceTime:[], + useingRates:[], + dates: [], + xianshi:"", + readOnly:true, + queryParam: { + // dateTime:undefined, + // timeType:'2' + }, + queryParams:{}, + queryParamEquip:{}, + queryParamPeople:{}, + dataStartsoucre:[], + url: { + dayUtilizationRateContrast:'/mdc/efficiencyReport/dayUtilizationRateContrast', + getEquipmentByPid: '/mdc/mdcEquipment/getEquipmentByPid', + getEquipmentByDepPid:'/mdc/mdcEquipment/getEquipmentByDepPid' + }, + AnalysisList:{} + } + }, + watch:{ + Type(valmath){ + this.dataList = []; + this.queryParams.typeTree = valmath + // console.log(this.queryParams.typeTree) + }, + nodeTree(val) { //鐩戝惉currSelected 鍙樺寲锛屽皢鍙樺寲鍚庣殑鏁板�间紶閫掔粰 getCurrSelected 浜嬩欢 + if (JSON.stringify(val) != '{}') { + if (val.equipmentId) { + // this.$set(this.queryParam, 'tierName', val.title) + this.queryParamEquip.parentId = "" + this.queryParams.equipmentId = val.equipmentId + this.queryParamEquip.equipmentId = val.equipmentId + this.searchQuery() + } else { + // this.$set(this.queryParam, 'tierName', val.title) + this.queryParamEquip.parentId = val.key + this.queryParams.equipmentId = '' + this.initEquipment(val.key) + } + + + } + }, + nodePeople(val){ + if (JSON.stringify(val) != '{}') { + if (val.equipmentId) { + // this.$set(this.queryParam, 'tierName', val.title) + this.queryParamEquip.parentId = "" + this.queryParams.equipmentId = val.equipmentId + this.queryParamEquip.equipmentId = val.equipmentId + this.searchQuery() + } else { + // this.$set(this.queryParam, 'tierName', val.title) + this.queryParamEquip.parentId = val.key + this.queryParams.equipmentId = '' + this.initEquipmentDep(val.key) + } + + } + } + }, + methods: { + drawTu(){ + let dayAvailBar = this.$echarts.init(document.getElementById('dayAvailBar'), 'macarons'); + //dayAvailLine = echarts.init(document.getElementById('dayAvailLine')); + let dayAvailBarOption = { + title: { + text: '璁惧鏃ュ埄鐢ㄧ巼鍥�', + x: 'center', + textStyle: { + fontSize: 18, + fontWeight: 'bolder', + color: "#151414" + } + }, + tooltip: { + trigger: 'axis', + formatter: "{a} <br/>{b} :({c}%)" + }, + toolbox: { + show: true, + feature: { + mark: {show: true}, + dataView: {show: true, readOnly: false}, + magicType: {show: true, type: ['line', 'bar']}, + restore: {show: true}, + saveAsImage: {show: true} + } + }, + calculable: true, //鏄惁鍚敤鎷栨嫿閲嶈绠楃壒鎬� + xAxis: [ + { + type: 'category', + name: '鏃堕棿鍒嗘', + boundaryGap: true, + data: this.spaceTime + } + ], + yAxis: [ + { + type: 'value', + name: '鍒╃敤鐜�' + } + ], + series: [ + { + name: '鍒╃敤鐜�', + type: 'bar', + barWidth: 50, + itemStyle: { + normal: { + color: '#4169E1' + } + }, + data: this.useingRates, + markPoint: { + data: [ + {type: 'max', name: '鏈�澶у��', symbolSize: 70}, + {type: 'min', name: '鏈�灏忓��', symbolSize: 70} + ] + } + } + ] + }; + dayAvailBar.setOption(dayAvailBarOption); + }, + moment, + onChangeStart(time, timeString) { + this.queryParam.startTime = timeString + // console.log(time, timeString); + }, + onChangeEnd(time, timeString) { + this.queryParam.endTime = timeString + // console.log(time, timeString); + }, + disabledDate(current){ + //Can not slect days before today and today + return current && current > moment().subtract('days', 1); + }, + dataChange(val) { + this.queryParam.dateTime = val.format('YYYYMMDD') + }, + handleChange(value) { + this.queryParam.timeType = value + console.log(this.queryParam.timeType) + }, + tabChange(val) { + this.activeKey = val + }, + dateParamChange(v1, v2) { + // console.log(v1,v2) + this.queryParam.startDate = v2[0] + this.queryParam.endDate = v2[1] + // console.log(v2[0],v2[1]) + }, + loadAnalysis(){ + getAction(this.url.dayUtilizationRateContrast,this.queryParam).then(res => { + if (res.success) { + this.spaceTime.push(res.result.dataList) + for(let i = 0;i<res.result.dayRateDto.length;i++){ + this.useingRates.push(res.result.dayRateDto[i].utilizationRate) + } + this.drawTu() + } else { + this.$message.warning(res.message) + } + }).finally(() => { + this.loading = false + }) + }, + numFilter(value) { + if (value) { + return parseFloat((value * 100).toFixed(2)) + } else { + return '0' + } + }, + searchQuery(){ + this.spaceTime = [] + this.useingRates = [] + if(this.queryParams.typeTree == "1"){ + this.queryParams.parentId = this.queryParamEquip.parentId + // this.queryParams.equipmentId = this.queryParamEquip.equipmentId + + }else{ + this.queryParams.parentId = this.queryParamEquip.parentId + + // this.queryParams.equipmentId = "" + } + this.AnalysisList = []; + //鑾峰彇鏌ヨ鏉′欢 + this.queryParam.parentId = this.queryParams.parentId; + this.queryParam.equipmentId = this.queryParams.equipmentId; + this.queryParam.typeTree = this.queryParams.typeTree + getAction(this.url.dayUtilizationRateContrast,this.queryParam).then((res) => { + if(res.success){ + this.spaceTime=res.result.dateList + for(let i = 0;i<res.result.dayRateDto.length;i++){ + // res.result[i].useRateDayShift = this.numFilter(res.result[i].useRateDayShift) + this.useingRates.push(this.numFilter(res.result.dayRateDto[i].utilizationRate)) + } + this.drawTu() + }else{ + this.$message.warning(res.message) + } + }).finally(() => { + this.loading = false + }) + }, + searchReset() { + this.spaceTime = [] + this.useingRates = [] + if(this.queryParams.typeTree == "1"){ + this.typeTree = this.queryParams.typeTree + this.typeParent = this.queryParams.parentId + this.typeEquipment = this.queryParams.equipmentId + this.queryParams = {} + this.queryParam = {} + this.queryParams.typeTree = this.typeTree + this.queryParams.parentId = this.typeParent + if(this.queryParams.parentId != ""){ + this.queryParams.equipmentId = "" + this.initEquipment() + }else{ + if(this.queryParams.equipmentId == this.queryParamEquip.equipmentId){ + this.queryParams.equipmentId = this.typeEquipment + }else{ + this.queryParams.equipmentId = this.queryParamEquip.equipmentId + } + } + getAction(this.url.dayUtilizationRateContrast,this.queryParams).then((res) => { + if(res.success){ + this.spaceTime=res.result.dateList + for(let i = 0;i<res.result.dayRateDto.length;i++){ + this.useingRates.push(this.numFilter(res.result.dayRateDto[i].utilizationRate)) + } + this.drawTu() + }else{ + this.$message.warning(res.message) + } + }).finally(() => { + this.loading = false + }) + }else{ + this.typeTree = this.queryParams.typeTree + this.typeParent = this.queryParams.parentId + this.typeEquipment = this.queryParams.equipmentId + this.queryParams = {} + this.queryParam = {} + this.dates = [] + this.queryParams.typeTree = this.typeTree + this.queryParams.parentId = this.typeParent + if(this.queryParams.parentId != ""){ + this.queryParams.equipmentId = "" + this.initEquipment() + }else{ + if(this.queryParams.equipmentId == this.queryParamEquip.equipmentId){ + this.queryParams.equipmentId = this.typeEquipment + }else{ + this.queryParams.equipmentId = this.queryParamEquip.equipmentId + } + } + getAction(this.url.dayUtilizationRateContrast,this.queryParams).then((res) => { + if(res.success){ + this.spaceTime=res.result.dateList + for(let i = 0;i<res.result.dayRateDto.length;i++){ + this.useingRates.push(this.numFilter(res.result.dayRateDto[i].utilizationRate)) + } + this.drawTu() + }else{ + this.$message.warning(res.message) + } + }).finally(() => { + this.loading = false + }) + } + + }, + initEquipment(id) { + let _this = this + getAction(this.url.getEquipmentByPid, { pid: id }).then((res) => { + if (res.success) { + if (res.result != null) { + _this.$set(this.queryParams, 'equipmentName', res.result.equipmentName) + _this.$set(this.queryParams, 'equipmentId', res.result.equipmentId) + _this.$set(this.queryParam, 'equipmentId', res.result.equipmentId) + _this.equipment = res.result + _this.searchQuery() + } else { + this.queryParams = {} + // this.queryList() + this.equipment = {} + _this.$message.warning('璇疯仈绯荤鐞嗗憳锛屽紑鏀捐澶囨潈闄愶紒') + } + }else{ + this.$message.warning(res.message) + } + }) + }, + initEquipmentDep(id) { + let _this = this + getAction(this.url.getEquipmentByDepPid, { pid: id }).then((res) => { + if (res.success) { + if (res.result != null) { + _this.$set(this.queryParams, 'equipmentName', res.result.equipmentName) + _this.$set(this.queryParams, 'equipmentId', res.result.equipmentId) + _this.$set(this.queryParam, 'equipmentId', res.result.equipmentId) + _this.equipment = res.result + _this.searchQuery() + } else { + this.queryParams = {} + // this.queryList() + this.equipment = {} + _this.$message.warning('璇疯仈绯荤鐞嗗憳锛屽紑鏀捐澶囨潈闄愶紒') + } + }else{ + this.$message.warning(res.message) + } + }) + } + }, + created() { + this.dates = [moment().subtract('days', 7), moment().subtract('days', 0)] + 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.queryParams.typeTree = "1"; + this.initEquipment() + + }, + } +</script> + +<style lang="less" scoped> + /*@import '~@assets/less/common.less';*/ + + @media screen and (min-width: 1920px){ + .device_list{ + height: 811px!important; + overflow: scroll; + } + } + @media screen and (min-width: 1680px) and (max-width: 1920px){ + .device_list{ + height: 811px!important; + overflow: scroll; + } + } + @media screen and (min-width: 1400px) and (max-width: 1680px){ + .device_list{ + height: 663px!important; + overflow: scroll; + } + } + @media screen and (min-width: 1280px) and (max-width: 1400px){ + .device_list{ + height: 564px!important; + overflow: scroll; + } + } + @media screen and (max-width: 1280px){ + .device_list{ + height: 564px!important; + overflow: scroll; + } + } + /*.device_list{*/ + /*display: flex;*/ + /*}*/ + /*.device_list .table-page-search-wrapper{*/ + /**/ + /*}*/ + /deep/ .ant-card-body{ + height: 100%!important; + } + .device_list .com_box{ + display: flex!important; + height: 100%!important; + flex-direction: column!important; + } + .device_list .table-page-search-wrapper{ + height: 6%!important; + } + .device_list #DeviceList{ + height: 90%!important; + } +</style> diff --git a/src/views/mdc/base/modules/equipmentDayAvail/equipmentDayAvailMain.vue b/src/views/mdc/base/modules/equipmentDayAvail/equipmentDayAvailMain.vue new file mode 100644 index 0000000..2adf041 --- /dev/null +++ b/src/views/mdc/base/modules/equipmentDayAvail/equipmentDayAvailMain.vue @@ -0,0 +1,483 @@ +<template> + <a-card :bordered="false" class="device_list"> + <div class="com_box"> + <!-- 鏌ヨ鍖哄煙 --> + <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="4" :sm="4"> + <a-form-item label="璁惧缂栧彿"> + <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentId"></a-input> + </a-form-item> + </a-col> + <a-col :md="4" :sm="4"> + <a-form-item label="璁惧鍚嶇О"> + <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentName"></a-input> + </a-form-item> + </a-col> + <a-col :md="5" :sm="5" :xs="5"> + <a-form-item label="鏃ユ湡"> + <a-date-picker v-model="queryParam.dateTime" :disabledDate="disabledDate" format='YYYYMMDD' @change="dataChange"/> + </a-form-item> + </a-col> + <a-col :md="4" :sm="4" :xs="4"> + <a-form-item label="闂撮殧"> + <a-select default-value="2" style="width: 80px" v-model="queryParam.timeType"> + <a-select-option :value="2"> + 2 + </a-select-option> + <a-select-option :value="3"> + 3 + </a-select-option> + <a-select-option :value="4"> + 4 + </a-select-option> + <a-select-option :value="6"> + 6 + </a-select-option> + </a-select>灏忔椂 + </a-form-item> + </a-col> + <a-col :md="2" :sm="3" :xs="3"> + <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> + </a-col> + <!--<a-col :md="2" :sm="2" :xs="2">--> + <!--<a-button type="primary" @click="searchReset" icon="reload">閲嶇疆</a-button>--> + <!--</a-col>--> + </a-row> + </a-form> + </div> + <!-- table鍖哄煙-begin --> + <div id="DeviceList"> + + <div style="padding: 5px;width: 100%;height: 100%"> + <div style="width: 100%;height: 100%" id="dayAvailBar"></div> + <!--<div id="dayAvailLine"></div>--> + </div> + </div> + <!-- table鍖哄煙-end --> + </div> + </a-card> +</template> + +<script> + import moment from 'moment' + import $ from 'jquery' + import JDictSelectTag from '@/components/dict/JDictSelectTag' + import JDate from '../../../../../components/jeecg/JDate' + import { + requestPut, + deleteAction, + getAction + } from '@/api/manage' + // import comparativeAnalysisBar from './comparativeAnalysisBar' + // import comparativeAnalysisGauge from'./comparativeAnalysisGauge' + // import conparativeAnalysisPie from './conparativeAnalysisPie' + import '@/components/table2excel/table2excel' + import JInput from '@/components/jeecg/JInput' + import JEllipsis from '@/components/jeecg/JEllipsis' + import Tooltip from 'ant-design-vue/es/tooltip' + import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api' + export default { + name: 'equipmentDayAvailMain', + // mixins: [JeecgListMixin], + components: { + Tooltip, + // comparativeAnalysisBar, + // comparativeAnalysisGauge, + // conparativeAnalysisPie, + JDictSelectTag, + JInput, + JDate, + JEllipsis + }, + props: { nodeTree: '', Type:'',nodePeople: '' }, + data() { + return { + activeKey: '1', + typeTree:"", + typeParent:1, + typeEquipment:1, + spaceTime:[], + useingRates:[], + dates: [], + xianshi:"", + readOnly:true, + queryParam: { + dateTime:undefined, + timeType:'2' + }, + queryParams:{}, + queryParamEquip:{}, + queryParamPeople:{}, + dataStartsoucre:[], + url: { + comparativeAnalysis:'/mdc/efficiencyReport/comparativeAnalysis', + dayUtilizationRate:'/mdc/efficiencyReport/dayUtilizationRate', + getEquipmentByPid: '/mdc/mdcEquipment/getEquipmentByPid', + getEquipmentByDepPid:'/mdc/mdcEquipment/getEquipmentByDepPid' + }, + AnalysisList:{} + } + }, + watch:{ + Type(valmath){ + this.dataList = []; + this.queryParams.typeTree = valmath + // console.log(this.queryParams.typeTree) + }, + nodeTree(val) { //鐩戝惉currSelected 鍙樺寲锛屽皢鍙樺寲鍚庣殑鏁板�间紶閫掔粰 getCurrSelected 浜嬩欢 + if (JSON.stringify(val) != '{}') { + if (val.equipmentId) { + // this.$set(this.queryParam, 'tierName', val.title) + this.queryParamEquip.parentId = "" + this.queryParams.equipmentId = val.equipmentId + this.queryParamEquip.equipmentId = val.equipmentId + this.searchQuery() + } else { + // this.$set(this.queryParam, 'tierName', val.title) + this.queryParamEquip.parentId = val.key + this.queryParams.equipmentId = '' + this.initEquipment(val.key) + } + + + } + }, + nodePeople(val){ + if (JSON.stringify(val) != '{}') { + if (val.equipmentId) { + // this.$set(this.queryParam, 'tierName', val.title) + this.queryParamEquip.parentId = "" + this.queryParams.equipmentId = val.equipmentId + this.queryParamEquip.equipmentId = val.equipmentId + this.searchQuery() + } else { + // this.$set(this.queryParam, 'tierName', val.title) + this.queryParamEquip.parentId = val.key + this.queryParams.equipmentId = '' + this.initEquipmentDep(val.key) + } + + } + } + }, + methods: { + drawTu(){ + let dayAvailBar = this.$echarts.init(document.getElementById('dayAvailBar'), 'macarons'); + //dayAvailLine = echarts.init(document.getElementById('dayAvailLine')); + let dayAvailBarOption = { + title: { + text: '璁惧鏃ュ埄鐢ㄧ巼鍥�', + x: 'center', + textStyle: { + fontSize: 18, + fontWeight: 'bolder', + color: "#151414" + } + }, + tooltip: { + trigger: 'axis', + formatter: "{a} <br/>{b} :({c}%)" + }, + toolbox: { + show: true, + feature: { + mark: {show: true}, + dataView: {show: true, readOnly: false}, + magicType: {show: true, type: ['line', 'bar']}, + restore: {show: true}, + saveAsImage: {show: true} + } + }, + calculable: true, //鏄惁鍚敤鎷栨嫿閲嶈绠楃壒鎬� + xAxis: [ + { + type: 'category', + name: '鏃堕棿鍒嗘', + boundaryGap: true, + data: this.spaceTime + } + ], + yAxis: [ + { + type: 'value', + name: '鍒╃敤鐜�' + } + ], + series: [ + { + name: '鍒╃敤鐜�', + type: 'bar', + barWidth: 50, + itemStyle: { + normal: { + color: '#4169E1' + } + }, + data: this.useingRates, + markPoint: { + data: [ + {type: 'max', name: '鏈�澶у��', symbolSize: 70}, + {type: 'min', name: '鏈�灏忓��', symbolSize: 70} + ] + } + } + ] + }; + dayAvailBar.setOption(dayAvailBarOption); + }, + disabledDate(current){ + //Can not slect days before today and today + return current && current > moment().subtract('days', 1); + }, + dataChange(val) { + this.queryParam.dateTime = val.format('YYYYMMDD') + }, + handleChange(value) { + this.queryParam.timeType = value + console.log(this.queryParam.timeType) + }, + tabChange(val) { + this.activeKey = val + }, + dateParamChange(v1, v2) { + // console.log(v1,v2) + this.queryParam.startTime = v2[0] + this.queryParam.endTime = v2[1] + // console.log(v2[0],v2[1]) + }, + loadAnalysis(){ + getAction(this.url.dayUtilizationRate,this.queryParam).then(res => { + if (res.success) { + this.spaceTime.push(res.result.dataList) + for(var i = 0;i<res.result.dayRateDto.length;i++){ + this.useingRates.push(res.result.dayRateDto[i].utilizationRate) + } + console.log(this,spaceTime) + this.drawTu() + } else { + this.$message.warning(res.message) + } + }).finally(() => { + this.loading = false + }) + }, + numFilter(value) { + if (value) { + return parseFloat((value * 100).toFixed(2)) + } else { + return '0' + } + }, + searchQuery(){ + this.spaceTime = [] + this.useingRates = [] + if(this.queryParams.typeTree == "1"){ + this.queryParams.parentId = this.queryParamEquip.parentId + // this.queryParams.equipmentId = this.queryParamEquip.equipmentId + + }else{ + this.queryParams.parentId = this.queryParamEquip.parentId + + // this.queryParams.equipmentId = "" + } + this.AnalysisList = []; + //鑾峰彇鏌ヨ鏉′欢 + this.queryParam.parentId = this.queryParams.parentId; + this.queryParam.equipmentId = this.queryParams.equipmentId; + this.queryParam.typeTree = this.queryParams.typeTree + getAction(this.url.dayUtilizationRate,this.queryParam).then((res) => { + if(res.success){ + this.spaceTime=res.result.dateList + for(var i = 0;i<res.result.dayRateDto.length;i++){ + this.useingRates.push(this.numFilter(res.result.dayRateDto[i].utilizationRate)) + } + this.drawTu() + }else{ + this.$message.warning(res.message) + } + }).finally(() => { + this.loading = false + }) + }, + searchReset() { + this.spaceTime = [] + this.useingRates = [] + if(this.queryParams.typeTree == "1"){ + this.typeTree = this.queryParams.typeTree + this.typeParent = this.queryParams.parentId + this.typeEquipment = this.queryParams.equipmentId + this.queryParams = {} + this.queryParam = {} + this.queryParams.typeTree = this.typeTree + this.queryParams.parentId = this.typeParent + if(this.queryParams.parentId != ""){ + this.queryParams.equipmentId = "" + this.initEquipment() + }else{ + if(this.queryParams.equipmentId == this.queryParamEquip.equipmentId){ + this.queryParams.equipmentId = this.typeEquipment + }else{ + this.queryParams.equipmentId = this.queryParamEquip.equipmentId + } + } + getAction(this.url.dayUtilizationRate,this.queryParams).then((res) => { + if(res.success){ + this.spaceTime=res.result.dateList + for(var i = 0;i<res.result.dayRateDto.length;i++){ + this.useingRates.push(this.numFilter(res.result.dayRateDto[i].utilizationRate)) + } + this.drawTu() + }else{ + this.$message.warning(res.message) + } + }).finally(() => { + this.loading = false + }) + }else{ + this.typeTree = this.queryParams.typeTree + this.typeParent = this.queryParams.parentId + this.typeEquipment = this.queryParams.equipmentId + this.queryParams = {} + this.queryParam = {} + this.dates = [] + this.queryParams.typeTree = this.typeTree + this.queryParams.parentId = this.typeParent + if(this.queryParams.parentId != ""){ + this.queryParams.equipmentId = "" + this.initEquipment() + }else{ + if(this.queryParams.equipmentId == this.queryParamEquip.equipmentId){ + this.queryParams.equipmentId = this.typeEquipment + }else{ + this.queryParams.equipmentId = this.queryParamEquip.equipmentId + } + } + getAction(this.url.dayUtilizationRate,this.queryParams).then((res) => { + if(res.success){ + this.spaceTime=res.result.dateList + for(var i = 0;i<res.result.dayRateDto.length;i++){ + this.useingRates.push(this.numFilter(res.result.dayRateDto[i].utilizationRate)) + } + this.drawTu() + }else{ + this.$message.warning(res.message) + } + }).finally(() => { + this.loading = false + }) + } + + }, + initEquipment(id) { + let _this = this + getAction(this.url.getEquipmentByPid, { pid: id }).then((res) => { + if (res.success) { + if (res.result != null) { + _this.$set(this.queryParams, 'equipmentName', res.result.equipmentName) + _this.$set(this.queryParams, 'equipmentId', res.result.equipmentId) + _this.$set(this.queryParam, 'equipmentId', res.result.equipmentId) + _this.equipment = res.result + _this.searchQuery() + } else { + this.queryParams = {} + // this.queryList() + this.equipment = {} + _this.$message.warning('璇疯仈绯荤鐞嗗憳锛屽紑鏀捐澶囨潈闄愶紒') + } + }else{ + this.$message.warning(res.message) + } + }) + }, + initEquipmentDep(id) { + let _this = this + getAction(this.url.getEquipmentByDepPid, { pid: id }).then((res) => { + if (res.success) { + if (res.result != null) { + _this.$set(this.queryParams, 'equipmentName', res.result.equipmentName) + _this.$set(this.queryParams, 'equipmentId', res.result.equipmentId) + _this.$set(this.queryParam, 'equipmentId', res.result.equipmentId) + _this.equipment = res.result + _this.searchQuery() + } else { + this.queryParams = {} + // this.queryList() + this.equipment = {} + _this.$message.warning('璇疯仈绯荤鐞嗗憳锛屽紑鏀捐澶囨潈闄愶紒') + } + }else{ + this.$message.warning(res.message) + } + }) + } + }, + created() { + let collectTime = moment(moment().add(-1,'d'),'YYYY-MM-DD'); + + + this.queryParams.collectTime = collectTime; + + this.queryParam.dateTime = this.queryParams.collectTime.format('YYYYMMDD') + this.queryParams.typeTree = '1' + this.initEquipment() + + }, + } +</script> + +<style lang="less" scoped> + /*@import '~@assets/less/common.less';*/ + + @media screen and (min-width: 1920px){ + .device_list{ + height: 811px!important; + overflow: scroll; + } + } + @media screen and (min-width: 1680px) and (max-width: 1920px){ + .device_list{ + height: 811px!important; + overflow: scroll; + } + } + @media screen and (min-width: 1400px) and (max-width: 1680px){ + .device_list{ + height: 663px!important; + overflow: scroll; + } + } + @media screen and (min-width: 1280px) and (max-width: 1400px){ + .device_list{ + height: 564px!important; + overflow: scroll; + } + } + @media screen and (max-width: 1280px){ + .device_list{ + height: 564px!important; + overflow: scroll; + } + } + /*.device_list{*/ + /*display: flex;*/ + /*}*/ + /*.device_list .table-page-search-wrapper{*/ + /**/ + /*}*/ + /deep/ .ant-card-body{ + height: 100%!important; + } + .device_list .com_box{ + display: flex!important; + height: 100%!important; + flex-direction: column!important; + } + .device_list .table-page-search-wrapper{ + height: 6%!important; + } + .device_list #DeviceList{ + height: 90%!important; + } +</style> diff --git a/src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue b/src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue new file mode 100644 index 0000000..c671ece --- /dev/null +++ b/src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue @@ -0,0 +1,507 @@ +<template> + <div class="efficiency_list" style="width: 100%;height: 100%;"> + <a-card :bordered="false"> + <!-- 鏌ヨ鍖哄煙 --> + <div class="table-page-search-wrapper"> + <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> + </a-col> + <a-col :lg="2" :md="3" :sm="3" :xs="3"> + <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> + </a-col> + </a-row> + </a-form> + </div> + <div id="DeviceList"> + <div class="openRateTrendDg" style="width: 100%;height: 40%;overflow: scroll"> + <div id="Efficiency" class="container" style="margin-top: 20px;width: 100%;height: 300px"> + <div class="table2" style="width: 100%;height: 300px"> + <table class="dataContent table" border="1" cellspacing="0" cellpadding="0" style="white-space: nowrap;width: 100%;height: 300px;text-align: center;"> + <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: 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.equipmentId}}</td> + <td class="tdgu1 kaitou">{{item.equipmentName}}</td> + <td class="tdgu2 kaitou">{{item.equipmentType}}</td> + <template v-for="(tableHead, index) in item.dataList"> + <td :style="{background:tableHead.color }">{{tableHead.utilizationRate | numFilter}}</td> + </template> + </tr> + </tbody> + </table> + </div> + </div> + </div> + <div id="openRateTrendChart" style="width: 100%;height: 60%"></div> + </div> + </a-card> + </div> +</template> + +<script> + import moment from 'moment' + import { putAction, getAction } from '@/api/manage' + import $ from 'jquery' + import '@/components/table2excel/table2excel' + import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api' + import { + JeecgListMixin + } from '@/mixins/JeecgListMixin' + export default { + // mixins: [JeecgListMixin], + name: 'openRateTrendAnalysisMain', + components: {}, + data() { + return { + dataSource: [], + /* table鍔犺浇鐘舵�� */ + loading: false, + typeTree: "", + typeParent: 1, + typeEquipment: 1, + TreeIDOne: 1, + TreeIDTwo: 2, + deviceTypeDict: '', + dates: [], + identifying: [], + queryParam: {}, + queryParams: {}, + queryParamEquip: {}, + queryParamPeople: {}, + efficiencyOptions: [ + { label: '鍒╃敤鐜�', value: 'lyl' }, + { label: '寮�鏈虹巼', value: 'kjl' }, + { label: '寮�鏈烘椂闂�', value: 'kjsj' }, + { label: '鍔犲伐鏃堕棿', value: 'jgsj' }, + { label: '寰呮満鏃堕棿', value: 'djsj' }, + { label: '鍏虫満鏃堕棿', value: 'gjsj' } + ], + checkedList: ['lyl'], + dataList: [], + url: { + efficiencyList: '/mdc/efficiencyReport/utilizationRateTrendAnalyze', + listByType: '/mdc/MdcUtilizationRate/getByType' + }, + tableHeads: [], + XData:[0], + YData:[0], + } + }, + props: { nodeTree: '', Type: '', nodePeople: '' }, + /** + * 鐢熷懡鍛ㄦ湡 鎸傝浇鍓� + * */ + 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() + }, + watch: { + Type(valmath) { + this.dataList = []; + this.queryParam.typeTree = valmath + }, + nodeTree(val) { //鐩戝惉currSelected 鍙樺寲锛屽皢鍙樺寲鍚庣殑鏁板�间紶閫掔粰 getCurrSelected 浜嬩欢 + if (JSON.stringify(val) != '{}') { + if (val.equipmentId != null) { + this.queryParamEquip.parentId = '' + this.queryParamEquip.equipmentId = val.equipmentId + } else { + this.queryParamEquip.parentId = val.key + this.queryParamEquip.equipmentId = '' + } + /*杩欓噷浣犳槸鐩戝惉鍒版爲寰楀彉鍖� 鏄笉鏄姹備竴娆�*/ + this.searchQuery() + } + }, + nodePeople(val) { + if (JSON.stringify(val) != '{}') { + if (val.equipmentId != null) { + this.queryParamPeople.parentId = val.equipmentId + this.queryParamPeople.equipmentId = '' + } else { + this.queryParamPeople.parentId = val.key + this.queryParamPeople.equipmentId = '' + } + this.searchQuery() + } + } + }, + filters: { + numFilter(value) { + if (value) { + return parseFloat((value * 100).toFixed(2)) + } else { + return '0' + } + } + }, + methods: { + numBerTwo(value){ + if (value) { + return parseFloat((value * 100).toFixed(2)) + } else { + return '0' + } + }, + TableDraw(key,val) { + this.XData=[0] + this.YData[0] + var Xarr = [] + var Yarr = [] + for (var i = 0; i < val.dataList.length; i++) { + Xarr.push(val.dataList[i].theDate) + Yarr.push(this.numBerTwo(val.dataList[i].utilizationRate)) + } + this.XData=Xarr + this.YData=Yarr + // if(this.openRateTrendAnalysisChart !=null && this.openRateTrendAnalysisChart != '' && this.openRateTrendAnalysisChart != undefined){ + // this.openRateTrendAnalysisChart.dispose() + // } + + this.draw() + }, + disabledDate(current) { + //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.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() + // this.onClearSelected() + }, + // 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() { + this.tableHeads = [] + this.dataList = [] + 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) + + } + }) + }, + draw(){ + let openRateTrendAnalysisChart = this.$echarts.init(document.getElementById('openRateTrendChart'), 'macarons'); + let openRateTrendChartOptions = { + title: { + text: '鍒╃敤鐜囪蛋鍔垮垎鏋�', + x: 'center', + textStyle: { + fontSize: 18, + fontWeight: 'bolder', + color: "#151414" + } + }, + tooltip: { + trigger: 'axis' + }, + toolbox: { + show: true, + feature: { + mark: { show: true }, + dataView: { show: true, readOnly: false }, + magicType: { show: true, type: ['line', 'bar'] }, + restore: { show: true }, + saveAsImage: { show: true } + } + }, + calculable: true, + xAxis: [ + { + type: 'category', + data: this.XData + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: [ + { + name: '鍒╃敤鐜�', + type: 'bar', + data: this.YData, + markPoint: { + data: [ + { type: 'max', name: '鏈�澶у��', symbolSize: 70 }, + { type: 'min', name: '鏈�灏忓��', symbolSize: 70 } + ] + }, + markLine: { + data: [ + { type: 'average', name: '骞冲潎鍊�' } + ] + } + } + ] + }; + openRateTrendAnalysisChart.setOption(openRateTrendChartOptions,true); + } + } + } +</script> +<style scoped> + /*.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: 687px!important;*/ + /*overflow: scroll;*/ + /*}*/ + /*}*/ + /*@media screen and (min-width: 1680px) and (max-width: 1920px){*/ + /*#Efficiency{*/ + /*height: 687px!important;*/ + /*overflow: scroll;*/ + /*}*/ + /*}*/ + /*@media screen and (min-width: 1400px) and (max-width: 1680px){*/ + /*#Efficiency{*/ + /*height: 540px!important;*/ + /*overflow: scroll;*/ + /*}*/ + /*}*/ + /*@media screen and (min-width: 1280px) and (max-width: 1400px){*/ + /*#Efficiency{*/ + /*height: 440px!important;*/ + /*overflow: scroll;*/ + /*}*/ + /*}*/ + /*@media screen and (max-width: 1280px){*/ + /*#Efficiency{*/ + /*height: 440px!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; + } +</style> \ No newline at end of file diff --git a/src/views/mdc/base/openRateTrendAnalysis.vue b/src/views/mdc/base/openRateTrendAnalysis.vue new file mode 100644 index 0000000..07c67b2 --- /dev/null +++ b/src/views/mdc/base/openRateTrendAnalysis.vue @@ -0,0 +1,123 @@ +<template> + <div style="width: 100%; height: 100%;"> + <a-card :bordered="false"> + <a-row type="flex" :gutter="16"> + <a-col :md="4"> + <a-tabs :activeKey="activeKey" @change="tabChange"> + <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> + <base-tree @getCurrSelected="changeSelectionNode"></base-tree> + </a-tab-pane> + <a-tab-pane key="2" tab="閮ㄩ棬灞傜骇">, + <depart-tree @getCurrSelectedDD="changeSelectionNodedd" + ></depart-tree> + </a-tab-pane> + </a-tabs> + </a-col> + <a-col :md="20"> + <!--<EfficiencyList ref="EfficiencyList" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></EfficiencyList>--> + <open-rate-trend-analysis-main ref="EfficiencyList" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></open-rate-trend-analysis-main> + </a-col> + </a-row> + </a-card> + </div> + +</template> + +<script> + import { putAction, getAction } from '@/api/manage' + import { frozenBatch } from '@/api/api' + import { JeecgListMixin } from '@/mixins/JeecgListMixin' + import JInput from '@/components/jeecg/JInput' + import BaseTree from '../common/BaseTree' + import openRateTrendAnalysisMain from './modules/openRateTrendAnalysis/openRateTrendAnalysisMain' + import JSuperQuery from '@/components/jeecg/JSuperQuery' + import JThirdAppButton from '@/components/jeecgbiz/thirdApp/JThirdAppButton' + import DepartTree from './modules/DepartList/DepartListTree/DepartTree' + export default { + name: 'openRateTrendAnalysis', + components: { + JThirdAppButton, + JInput, + BaseTree, + JSuperQuery, + DepartTree, + openRateTrendAnalysisMain + }, + data() { + return { + activeKey: '1', + description: '璁惧淇℃伅', + selectEquementId: '', + selectEquement: {}, + selectPeople:{}, + slectTypeTree:"", + url: { + equipmentStatistics: '/mdc/equipment/equipmentStatistics' + } + } + }, + created() { + }, + methods: { + tabChange(val) { + // console.log(val); + this.activeKey = val + this.slectTypeTree = val + }, + // changeSelection(val) { + // this.selectEquementId = val + // this.$refs.efficiencyList.pQuery(val) + // this.$refs.efficiencyList.searchQuery() + // }, + changeSelectionNode(val) { + this.selectEquement = val + this.slectTypeTree = "1" + }, + changeSelectionNodedd(val) { + this.selectPeople = val + this.slectTypeTree = "2" + } + } + + } +</script> +<style scoped> + @import '~@assets/less/common.less'; + + .equipMessage { + width: 100%; + height: 10%; + } + + .equipMessage table { + width: 60%; + height: 100%; + line-height: 50%; + } + + .equipMessage table td { + text-align: center; + } + + .equipMessage table td span { + display: inline-block; + width: 15px; + height: 15px; + } + + .equipMessage table td .equipShutdown { + background-color: #808080; + } + + .equipMessage table td .equipStandby { + background-color: #ffbf37; + } + + .equipMessage table td .equipRun { + background-color: #19FE01; + } + + .equipMessage table td .equipAlarm { + background-color: #FD0008; + } +</style> \ No newline at end of file -- Gitblit v1.9.3