From 51b9e548b0e533e8a415ce141808f2bb747b381e Mon Sep 17 00:00:00 2001 From: zhuzhuanzhuan Date: 星期一, 18 三月 2024 16:08:49 +0800 Subject: [PATCH] 1、mdc菜单下除特殊要求外,页面表格最少条数由10条调整为30条,每页最多条数区间由[10,20,30]调整为[30,50,100] 2、OEE基础管理和数据报表模块增加打印按钮,实现打印表格数据功能 3、设备管理、数据报表模块增加按照设备级别和设备类型查询表格数据 4、设备车间管理页面增加车间编码字段 5、修改组件名称以试图解决刷新后进入请求json页面问题 --- src/views/mdc/base/modules/efficiencyReport/EfficiencyList.vue | 1265 ++++++++++++++++++++++++++++++++------------------------ 1 files changed, 720 insertions(+), 545 deletions(-) diff --git a/src/views/mdc/base/modules/efficiencyReport/EfficiencyList.vue b/src/views/mdc/base/modules/efficiencyReport/EfficiencyList.vue index a9bd0dc..f7227f6 100644 --- a/src/views/mdc/base/modules/efficiencyReport/EfficiencyList.vue +++ b/src/views/mdc/base/modules/efficiencyReport/EfficiencyList.vue @@ -1,606 +1,781 @@ <template> <div class="efficiency_list" style="width: 100%"> - <a-card :bordered="false"> + <div :bordered="false"> <!-- 鏌ヨ鍖哄煙 --> <div> <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-col :md="4" :sm="4"> + <a-form-item label="璁惧绫诲瀷"> + <a-select placeholder="璇烽�夋嫨璁惧绫诲瀷" :triggerChange="true" v-model="queryParam.equipmentType" + :allowClear="true"> + <a-select-option v-for='item in selectList' :key='item.id' :value='item.equipmentTypeName'> + {{item.equipmentTypeName}} + </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="4" :sm="4"> + <a-form-item label="椹卞姩绫诲瀷"> + <a-auto-complete + v-model="queryParam.driveType" + :data-source="driveTypeList" + placeholder="璇烽�夋嫨椹卞姩绫诲瀷" + :filter-option="filterOption" + /> + </a-form-item> </a-col> - <a-col :lg="2" :md="3" :sm="3" :xs="3"> - <a-button type="primary" @click="searchReset" icon="reload">閲嶇疆</a-button> + <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 :lg="2" :md="3" :sm="3" :xs="3"> - <a-button type="primary" @click="exportExcel" icon="download">瀵煎嚭</a-button> + <a-col :md="4" :sm="4" :xs="4"> + <a-form-item label="璁惧绾у埆"> + <j-dict-select-tag placeholder="璇烽�夋嫨璁惧绾у埆" dictCode="device_level" v-model="queryParam.deviceLevel" + allow-clear/> + </a-form-item> + </a-col> + <a-col :md="4" :sm="4" :xs="4"> + <a-form-item label="璁惧绉嶇被"> + <j-dict-select-tag placeholder="璇烽�夋嫨璁惧绉嶇被" dictCode="device_category" + v-model="queryParam.deviceCategory" + allow-clear/> + </a-form-item> </a-col> </a-row> - <a-row :gutter="24"> - <a-col :md="15" :sm="15"> - <a-checkbox-group :value="checkedList" :default-value="['lyl']" :options="efficiencyOptions" - @change="efficiencyOptionsOnChange"/> + + <a-row :gutter="24" type="flex" align="middle"> + <a-col :md="24" :sm="24" :xs="24" + style="display: flex;justify-content: space-between;align-items: flex-start"> + <div> + <a-space style="margin-right: 20px"> + <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> + <a-button type="primary" @click="searchReset" icon="reload">閲嶇疆</a-button> + <a-button type="primary" @click="exportExcel" icon="download">瀵煎嚭</a-button> + <a-button type="primary" icon="printer" v-print="'#Efficiency'" + v-has="'efficiency:print'">鎵撳嵃 + </a-button> + </a-space> + <a-checkbox-group :value="checkedList" :default-value="['lyl']" :options="efficiencyOptions" + @change="efficiencyOptionsOnChange"/> + </div> + <table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;"> + <tr> + <td v-for="(item, index) in identifying">{{item.title}}</td> + </tr> + <tr> + <td style="text-align:center;" v-for="(item, index) in identifying"> + <div class="identifyingclass" :style="{background: item.color}"></div> + </td> + </tr> + </table> </a-col> + <!--<a-col :md="6" :sm="6">--> + <!--<a-space>--> + <!--<a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>--> + <!--<a-button type="primary" @click="searchReset" icon="reload">閲嶇疆</a-button>--> + <!--<a-button type="primary" @click="exportExcel" icon="download">瀵煎嚭</a-button>--> + <!--<a-button type="primary" icon="printer" v-print="'#Efficiency'" v-has="'efficiency:print'">鎵撳嵃--> + <!--</a-button>--> + <!--</a-space>--> + <!--</a-col>--> + <!--<a-col :md="18" :sm="18">--> + <!--<a-checkbox-group :value="checkedList" :default-value="['lyl']" :options="efficiencyOptions"--> + <!--@change="efficiencyOptionsOnChange"/>--> + <!--</a-col>--> </a-row> </a-form> </div> - <div style="width: 530px;position: absolute;top: 20px; right: 1.5%;"> - <table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;"> - <tr> - <td v-for="(item, index) in identifying">{{item.title}}</td> - </tr> - <tr> - <td style="text-align:center;" v-for="(item, index) in identifying"> - <div class="identifyingclass" :style="{background: item.color}"></div> - </td> - <!--<td style="text-align:center;"><div style="width: 55px;height: 15px;background-color: #e8ff37;display:inline-block"></div></td>--> - <!--<td style="text-align:center;"><div style="width: 55px;height: 15px;background-color: #99ff4e;display:inline-block"></div></td>--> - </tr> - </table> - </div> + <!--<div style="width: 530px;position: absolute;top: 0; right: 1.5%;">--> + <!--<table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;">--> + <!--<tr>--> + <!--<td v-for="(item, index) in identifying">{{item.title}}</td>--> + <!--</tr>--> + <!--<tr>--> + <!--<td style="text-align:center;" v-for="(item, index) in identifying">--> + <!--<div class="identifyingclass" :style="{background: item.color}"></div>--> + <!--</td>--> + <!--<!–<td style="text-align:center;"><div style="width: 55px;height: 15px;background-color: #e8ff37;display:inline-block"></div></td>–>--> + <!--<!–<td style="text-align:center;"><div style="width: 55px;height: 15px;background-color: #99ff4e;display:inline-block"></div></td>–>--> + <!--</tr>--> + <!--</table>--> + <!--</div>--> </div> - <div id="Efficiency" class="container" style="margin-top: 20px;"> - <div class="table2"> - <table class="dataContent table" border="1" cellspacing="0" cellpadding="0" style="white-space: nowrap"> - <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> - <th class="thgu dong5 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;">璁惧鍚嶇О</th> - <th class="thgu dong6 name" rowspan="2" style="min-width: 100px; max-width: 100px;width: 100px;">璁惧绫诲瀷</th> - <!--<th rowspan="2">缁勫埆</th>--> - <template v-for="(tableHead, index) in tableHeads"> - <th class="timeth" :colspan="checkedList.length">{{tableHead}}</th> - </template> - </tr> - <tr class="thead notfixed gudingth"> - <template v-for="(tableHead, index) in tableHeads"> - <th>鍒╃敤鐜�(%)</th> - <th v-if="checkedList.indexOf('kjl') > -1">寮�鏈虹巼(%)</th> - <th v-if="checkedList.indexOf('kjsj') > -1">寮�鏈烘椂闂�(s)</th> - <th v-if="checkedList.indexOf('jgsj') > -1">鍔犲伐鏃堕棿(s)</th> - <th v-if="checkedList.indexOf('djsj') > -1">寰呮満鏃堕棿(s)</th> - <th v-if="checkedList.indexOf('gjsj') > -1">鍏虫満鏃堕棿(s)</th> - </template> - </tr> - </thead> - <tbody> - <tr class="mathData" v-for="(item, index) in dataList"> - <td class="tdgu kaitou" :rowspan="item.level1span" :class="{hidden: item.level1dis,noExl:item.level1dis}" v-show="!item.level1dis">{{item.level1}}</td> - <td class="tdgu1 kaitou" :rowspan="item.level2span" :class="{hidden: item.level2dis,noExl:item.level2dis}" v-show="!item.level2dis">{{item.level2}}</td> - <td class="tdgu2 kaitou" :rowspan="item.level3span" :class="{hidden: item.level3dis,noExl:item.level3dis}" v-show="!item.level3dis">{{item.level3}}</td> - <td class="tdgu3 kaitou">{{item.equipmentId}}</td> - <td class="tdgu4 kaitou">{{item.equipmentName}}</td> - <td class="tdgu5 kaitou">{{item.equipmentType}}</td> - <template v-for="(tableHead, index) in item.dataList"> - <td :style="{background:tableHead.color }">{{tableHead.utilizationRate | numFilter}}</td> - <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('kjl') > -1"> - {{tableHead.openRate | numFilter}} - </td> - <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('kjsj') > -1"> - {{tableHead.openLong}} - </td> - <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('jgsj') > -1"> - {{tableHead.processLong}} - </td> - <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('djsj') > -1"> - {{tableHead.waitLong}} - </td> - <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('gjsj') > -1"> - {{tableHead.closeLong}} - </td> - </template> - </tr> - </tbody> - </table> + <a-spin :spinning="spinning"> + <div id="Efficiency" class="container" style="margin-top: 20px;"> + <div class="table2"> + <table class="dataContent table" border="1" cellspacing="0" cellpadding="0" style="white-space: nowrap" + v-if="dataList.length>0"> + <thead> + <tr class="thead fixed equipname"> + <th class="thgu dong1 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;">鍏徃</th> + <th class="thgu dong2 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;">杞﹂棿</th> + <th class="thgu dong3 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;">宸ユ</th> + <th class="thgu dong4 name" rowspan="2" style="min-width: 100px; max-width: 100px;width: 100px;">璁惧缂栧彿 + </th> + <th class="thgu dong5 name" rowspan="2" style="min-width: 162px; max-width: 162px;width: 162px;">璁惧鍚嶇О + </th> + <th class="thgu dong6 name" rowspan="2" style="min-width: 100px; max-width: 100px;width: 100px;">璁惧绫诲瀷 + </th> + <!--<th rowspan="2">缁勫埆</th>--> + <template v-for="(tableHead, index) in tableHeads"> + <th class="timeth" :colspan="checkedList.length">{{tableHead}}</th> + </template> + </tr> + <tr class="thead notfixed gudingth"> + <template v-for="(tableHead, index) in tableHeads"> + <th>鍒╃敤鐜�(%)</th> + <th v-if="checkedList.indexOf('kjl') > -1">寮�鏈虹巼(%)</th> + <th v-if="checkedList.indexOf('kjsj') > -1">寮�鏈烘椂闂�(灏忔椂)</th> + <th v-if="checkedList.indexOf('jgsj') > -1">鍔犲伐鏃堕棿(灏忔椂)</th> + <th v-if="checkedList.indexOf('djsj') > -1">寰呮満鏃堕棿(灏忔椂)</th> + <th v-if="checkedList.indexOf('gjsj') > -1">鍏虫満鏃堕棿(灏忔椂)</th> + </template> + + </tr> + </thead> + <tbody> + + <tr class="mathData" v-for="(item, index) in dataList"> + <template v-if="item.level1!=='鍚堣'&&item.level1!=='骞冲潎鍊�'"> + <td class="tdgu kaitou" :rowspan="item.level1span" + :class="{hidden: item.level1dis,noExl:item.level1dis}" v-show="!item.level1dis"> + <div class="wenzi"> + {{item.level1}} + </div> + </td> + <td class="tdgu1 kaitou" :rowspan="item.level2span" + :class="{hidden: item.level2dis,noExl:item.level2dis}" v-show="!item.level2dis"> + <div class="wenzi"> + {{item.level2}} + </div> + </td> + <td class="tdgu2 kaitou wenzi" :rowspan="item.level3span" + :class="{hidden: item.level3dis,noExl:item.level3dis}" v-show="!item.level3dis"> + <div class="wenzi"> + {{item.level3}} + </div> + </td> + <td class="tdgu3 kaitou">{{item.equipmentId}}</td> + <td class="tdgu4 kaitou" style="min-width: 162px; max-width: 162px;width: 162px;"> + {{item.equipmentName}} + </td> + <td class="tdgu5 kaitou">{{item.equipmentType}}</td> + </template> + + <!--鍚堣涓庡钩鍧囧�煎尯鍩�--> + <template v-else> + <td colspan="6" class="tdgu kaitou">{{item.level1}}</td> + </template> + + <template v-for="(tableHead, index) in item.dataList"> + <td :style="{background:tableHead.color }">{{tableHead.utilizationRate | numFilter}}</td> + <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('kjl') > -1"> + {{tableHead.openRate | numFilter}} + </td> + <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('kjsj') > -1"> + {{tableHead.openLong | getFormattedTime}} + </td> + <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('jgsj') > -1"> + {{tableHead.processLong | getFormattedTime}} + </td> + <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('djsj') > -1"> + {{tableHead.waitLong | getFormattedTime}} + </td> + <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('gjsj') > -1"> + {{tableHead.closeLong | getFormattedTime}} + </td> + </template> + + </tr> + + </tbody> + </table> + + </div> </div> - </div> - </a-card> + </a-spin> + </div> </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' -export default { - name: 'EfficiencyList', - components: {}, - data() { - return { - 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: { - list: '/mdc/efficiencyReport/efficiencyList', - listByType: '/mdc/MdcUtilizationRate/getByType' - }, - tableHeads: [], + 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 api from '@/api/mdc' - } - }, - props: { nodeTree: '',Type:'',nodePeople:'' }, - created() { - this.showIdentifying() - this.dates = [moment().subtract('days', 8), moment().subtract('days', 1)] - this.queryParam.startTime = moment(this.dates[0]).format('YYYYMMDD') - this.queryParam.endTime = moment(this.dates[1]).format('YYYYMMDD') - this.queryParam.typeTree = "1" - this.loadData() - }, - 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() + export default { + name: 'EfficiencyList', + components: {}, + data() { + return { + typeTree: '', + typeParent: 1, + typeEquipment: 1, + TreeIDOne: 1, + TreeIDTwo: 2, + deviceTypeDict: '', + dates: [], + selectList: [], + driveTypeList:[], + 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: { + list: '/mdc/efficiencyReport/efficiencyList', + listByType: '/mdc/MdcUtilizationRate/getByType', + queryEquipmentType: '/mdc/mdcEquipmentType/queryEquipmentType' + }, + tableHeads: [], + distinguishColorList: [], + utilizationRateRowAverage: '', + openRateRowAverage: '', + openLongRowAverage: '', + processLongRowAverage: '', + waitLongRowAverage: '', + closeLongRowAverage: '', + spinning: false } }, - 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: { - checkSameData(dataList){ - let cache = {}; //瀛樺偍鐨勬槸閿槸kclx 鐨勫�硷紝鍊兼槸kclx 鍦╥ndeces涓暟缁勭殑涓嬫爣 - let indices = []; //鏁扮粍涓瘡涓�涓�兼槸涓�涓暟缁勶紝鏁扮粍涓殑姣忎竴涓厓绱犳槸鍘熸暟缁勪腑鐩稿悓kclx鐨勪笅鏍� - dataList.map((item,index)=>{ - let level1 = item.level1; - let _index = cache[level1]; - if(_index!==undefined){ - indices[_index].push(index) - }else{ - cache[level1] = indices.length - indices.push([index]) - } - }) - let result = []; - indices.map((item)=>{ - item.map((index)=>{ - result.push(dataList[index]) - }) - }) - this.dataList = result + props: { nodeTree: '', Type: '', nodePeople: '' }, + created() { + this.showIdentifying() + this.dates = [moment().subtract('days', 8), moment().subtract('days', 1)] + this.queryParam.startTime = moment(this.dates[0]).format('YYYYMMDD') + this.queryParam.endTime = moment(this.dates[1]).format('YYYYMMDD') + this.queryParam.typeTree = '1' + this.loadData() + this.queryGroup() + this.getDriveTypeByApi() }, - checkSameData1(dataList){ - let cache = {}; //瀛樺偍鐨勬槸閿槸kclx 鐨勫�硷紝鍊兼槸kclx 鍦╥ndeces涓暟缁勭殑涓嬫爣 - let indices = []; //鏁扮粍涓瘡涓�涓�兼槸涓�涓暟缁勶紝鏁扮粍涓殑姣忎竴涓厓绱犳槸鍘熸暟缁勪腑鐩稿悓kclx鐨勪笅鏍� - dataList.map((item,index)=>{ - let level2 = item.level2; - let _index = cache[level2]; - if(_index!==undefined){ - indices[_index].push(index) - }else{ - cache[level2] = indices.length - indices.push([index]) - } - }) - let result = []; - indices.map((item)=>{ - item.map((index)=>{ - result.push(dataList[index]) - }) - }) - this.dataList = result - }, - checkSameData2(dataList){ - let cache = {}; //瀛樺偍鐨勬槸閿槸kclx 鐨勫�硷紝鍊兼槸kclx 鍦╥ndeces涓暟缁勭殑涓嬫爣 - let indices = []; //鏁扮粍涓瘡涓�涓�兼槸涓�涓暟缁勶紝鏁扮粍涓殑姣忎竴涓厓绱犳槸鍘熸暟缁勪腑鐩稿悓kclx鐨勪笅鏍� - dataList.map((item,index)=>{ - let level3 = item.level3; - let _index = cache[level3]; - if(_index!==undefined){ - indices[_index].push(index) - }else{ - cache[level3] = indices.length - indices.push([index]) - } - }) - let result = []; - indices.map((item)=>{ - item.map((index)=>{ - result.push(dataList[index]) - }) - }) - this.dataList = result - }, - // 鍚堝苟 - combineCell() { - console.log(this.dataList) - let list =this.dataList; - for (let field in list[0]) { - var k = 0; - while (k < list.length) { - list[k][field + 'span'] = 1; - list[k][field + 'dis'] = false; - for (var i = k + 1; i <= list.length - 1; i++) { - if (list[k][field] == list[i][field] && list[k][field] != '') { - list[k][field + 'span']++; - list[k][field + 'dis'] = false; - list[i][field + 'span'] = 1; - list[i][field + 'dis'] = true; - } else { - break; - } + 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 = '' } - k = i; + 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() } } - return list; }, - disabledDate(current){ - //Can not slect days before today and today - return current && current > moment().subtract('days', 1); + filters: { + numFilter(value) { + if (value) { + return parseFloat((value * 100).toFixed(2)) + } else { + return '0' + } + }, + + /** + * 鏍煎紡鍖栨椂闂� + * @param seconds 绉掓暟 + * @returns '' 鏍煎紡鍖栧悗鏃堕棿瀛楃涓� + */ + getFormattedTime(seconds) { + if (seconds) { + return parseFloat((seconds / 3600).toFixed(2)) + } else { + return '0' + } + } }, - 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 + computed: {}, + methods: { + checkSameData(dataList) { + let cache = {} //瀛樺偍鐨勬槸閿槸kclx 鐨勫�硷紝鍊兼槸kclx 鍦╥ndeces涓暟缁勭殑涓嬫爣 + let indices = [] //鏁扮粍涓瘡涓�涓�兼槸涓�涓暟缁勶紝鏁扮粍涓殑姣忎竴涓厓绱犳槸鍘熸暟缁勪腑鐩稿悓kclx鐨勪笅鏍� + dataList.map((item, index) => { + let level1 = item.level1 + let _index = cache[level1] + if (_index !== undefined) { + indices[_index].push(index) + } else { + cache[level1] = indices.length + indices.push([index]) + } + }) + let result = [] + indices.map((item) => { + item.map((index) => { + result.push(dataList[index]) + }) + }) + this.dataList = result + }, + checkSameData1(dataList) { + let cache = {} //瀛樺偍鐨勬槸閿槸kclx 鐨勫�硷紝鍊兼槸kclx 鍦╥ndeces涓暟缁勭殑涓嬫爣 + let indices = [] //鏁扮粍涓瘡涓�涓�兼槸涓�涓暟缁勶紝鏁扮粍涓殑姣忎竴涓厓绱犳槸鍘熸暟缁勪腑鐩稿悓kclx鐨勪笅鏍� + dataList.map((item, index) => { + let level2 = item.level2 + let _index = cache[level2] + if (_index !== undefined) { + indices[_index].push(index) + } else { + cache[level2] = indices.length + indices.push([index]) + } + }) + let result = [] + indices.map((item) => { + item.map((index) => { + result.push(dataList[index]) + }) + }) + this.dataList = result + }, + checkSameData2(dataList) { + let cache = {} //瀛樺偍鐨勬槸閿槸kclx 鐨勫�硷紝鍊兼槸kclx 鍦╥ndeces涓暟缁勭殑涓嬫爣 + let indices = [] //鏁扮粍涓瘡涓�涓�兼槸涓�涓暟缁勶紝鏁扮粍涓殑姣忎竴涓厓绱犳槸鍘熸暟缁勪腑鐩稿悓kclx鐨勪笅鏍� + dataList.map((item, index) => { + let level3 = item.level3 + let _index = cache[level3] + if (_index !== undefined) { + indices[_index].push(index) + } else { + cache[level3] = indices.length + indices.push([index]) + } + }) + let result = [] + indices.map((item) => { + item.map((index) => { + result.push(dataList[index]) + }) + }) + this.dataList = result + }, + // 鍚堝苟 + combineCell() { + console.log(this.dataList) + let list = this.dataList + for (let field in list[0]) { + var k = 0 + while (k < list.length) { + list[k][field + 'span'] = 1 + list[k][field + 'dis'] = false + for (var i = k + 1; i <= list.length - 1; i++) { + if (list[k][field] == list[i][field] && list[k][field] != '') { + list[k][field + 'span']++ + list[k][field + 'dis'] = false + list[i][field + 'span'] = 1 + list[i][field + 'dis'] = true + } else { + break } } - } 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 - } + k = i + } + } + return list + }, + 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 + } + } + } + }) + } } } - } - }, - exportExcel() { - $("#Efficiency").table2excel({ - exclude: ".noExl", - name: "Excel Document Name", - filename: "鍒╃敤鐜�", - exclude_img: true, - fileext: ".xls", - exclude_links: true, - exclude_inputs: false - }); - }, - showIdentifying() { - getAction(this.url.listByType, { type: 'lyl' }).then(res => { - if (res.success) { - this.identifying = res.result - } - }) - }, - dateParamChange(v1, v2) { - this.queryParam.startTime = v2[0] - this.queryParam.endTime = v2[1] - }, - efficiencyOptionsOnChange(checkedList) { - let index = checkedList.indexOf('lyl') - if (index < 0) { - this.$message.warn('涓嶈兘鍙栨秷鏌ヨ鍒╃敤鐜�') - return false - } - this.checkedList = checkedList - }, - // searchQuery() { - // if(this.queryParam.typeTree == "1"){ - // // this.queryParam.TreeIDTwo = "" - // this.queryParam.parentId = this.queryParamEquip.parentId - // this.queryParam.equipmentId = this.queryParamEquip.equipmentId - // }else{ - // // this.queryParam.TreeIDOne = "" - // this.queryParam.parentId = this.queryParamPeople.parentId - // this.queryParam.equipmentId = "" - // } - // this.loadData() - // // this.onClearSelected() - // }, - // searchReset() { - // this.typeTree = this.queryParam.typeTree - // this.typeParent = this.queryParams.parentId - // this.queryParam = {} - // this.dates = [] - // this.queryParam.typeTree = this.typeTree - // this.queryParam.parentId = this.typeParent - // this.loadData() - // // this.onClearSelected() - // }, - 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.loadData() - // 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.loadData(); - // this.queryParam = {} - // this.dates = [] - // this.loadData() - // this.onClearSelected() - }, - loadData() { - this.tableHeads = [] - this.dataList = [] - getAction(this.url.list, this.queryParam).then(res => { - if (res.success) { - this.tableHeads = res.result.dates - this.dataList = res.result.mdcEfficiencyList - this.checkSameData(this.dataList) - this.checkSameData1(this.dataList) - this.checkSameData2(this.dataList) - this.combineCell(); - // this.initDeviceType(this.dataList) + }, + exportExcel() { + $('#Efficiency').table2excel({ + exclude: '.noExl', + name: 'Excel Document Name', + filename: '璁惧鍒╃敤鐜�', + exclude_img: true, + fileext: '.xls', + exclude_links: true, + exclude_inputs: false + }) + }, + showIdentifying() { + getAction(this.url.listByType, { type: 'lyl' }).then(res => { + if (res.success) { + this.identifying = res.result + } + }) + }, + dateParamChange(v1, v2) { + this.queryParam.startTime = v2[0] + this.queryParam.endTime = v2[1] + // 鐐瑰嚮鏃堕棿閫夋嫨鍣ㄧ殑娓呯┖鎸夐挳鏃朵細瑙﹀彂姝ゅ垽鏂�(鐐瑰嚮閲嶇疆鎸夐挳涓嶄細瑙﹀彂)锛屽疄鐜伴噸缃垪琛ㄥ姛鑳斤紝鍒囧疄鏀瑰彉鍒楄〃鏄剧ず鏁堟灉 + if (!this.queryParam.startTime && !this.queryParam.endTime) this.searchReset() + }, + efficiencyOptionsOnChange(checkedList) { + let index = checkedList.indexOf('lyl') + if (index < 0) { + // this.$message.warn('涓嶈兘鍙栨秷鏌ヨ寮�鍔ㄧ巼') + this.$notification.warning({ + message: '娑堟伅', + description: '涓嶈兘鍙栨秷鏌ヨ寮�鍔ㄧ巼' + }) + return false } - }) + this.checkedList = checkedList + }, + // searchQuery() { + // if(this.queryParam.typeTree == "1"){ + // // this.queryParam.TreeIDTwo = "" + // this.queryParam.parentId = this.queryParamEquip.parentId + // this.queryParam.equipmentId = this.queryParamEquip.equipmentId + // }else{ + // // this.queryParam.TreeIDOne = "" + // this.queryParam.parentId = this.queryParamPeople.parentId + // this.queryParam.equipmentId = "" + // } + // this.loadData() + // // this.onClearSelected() + // }, + // searchReset() { + // this.typeTree = this.queryParam.typeTree + // this.typeParent = this.queryParams.parentId + // this.queryParam = {} + // this.dates = [] + // this.queryParam.typeTree = this.typeTree + // this.queryParam.parentId = this.typeParent + // this.loadData() + // // this.onClearSelected() + // }, + searchQuery() { + console.log('dates', this.dates) + if (this.dates != '') { + 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.loadData() + } else { + this.$notification.warning({ + message: '娑堟伅', + description: '璇烽�夋嫨鏃堕棿' + }) + } + // this.onClearSelected() + }, + searchReset() { + this.typeTree = this.queryParam.typeTree + this.typeParent = this.queryParam.parentId + this.typeEquipment = this.queryParam.equipmentId + this.queryParam = {} + this.queryParam.typeTree = this.typeTree + this.queryParam.parentId = this.typeParent + this.queryParam.equipmentId = this.typeEquipment + this.dates = [moment().subtract('days', 8), moment().subtract('days', 1)] + this.queryParam.startTime = moment(this.dates[0]).format('YYYYMMDD') + this.queryParam.endTime = moment(this.dates[1]).format('YYYYMMDD') + // this.ipagination.current = 1 + this.loadData() + // this.queryParam = {} + // this.dates = [] + // this.loadData() + // this.onClearSelected() + }, + loadData() { + this.tableHeads = [] + this.dataList = [] + this.spinning = true + getAction(this.url.list, this.queryParam).then(res => { + if (res.success) { + this.tableHeads = res.result.dates + this.dataList = res.result.mdcEfficiencyList + if (res.result.mdcEfficiencyList && !res.result.mdcEfficiencyList.length) { + this.$notification.info({ + message: '娑堟伅', + description: '鏆傛棤璇ヨ澶囩被鍨嬫暟鎹�' + }) + } + this.distinguishColorList = res.result.utilizationRateList + this.checkSameData(this.dataList) + this.checkSameData1(this.dataList) + this.checkSameData2(this.dataList) + this.combineCell() + // this.columns.push(...dataColumns) + // this.initDeviceType(this.dataList) + } + }).finally(() => { + this.spinning = false + }) + }, + queryGroup() { + getAction(this.url.queryEquipmentType).then(res => { + if (res.success) { + this.selectList = res.result + // this.selectList = res.result.map((item, index, arr) => { + // return { label: item.id, value: item.equipmentTypeName + '' } + // }) + } else { + // this.$message.warning(res.message) + this.$notification.warning({ + message: '娑堟伅', + description: res.message + }) + } + }).finally(() => { + this.loading = false + }) + }, + + /** + * 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷 + */ + getDriveTypeByApi(){ + api.getDriveTypeApi().then((res)=>{ + this.driveTypeList=res.result.map(item=>item.value) + }) + }, + + /** + * 鑱旀兂杈撳叆妗嗙瓫閫夊姛鑳� + * @param input 杈撳叆鐨勫唴瀹� + * @param option 閰嶇疆 + * @returns {boolean} 鍒ゆ柇鏄惁绛涢�� + */ + filterOption(input, option) { + return ( + option.componentOptions.children[0].text.toUpperCase().indexOf(input.toUpperCase()) >= 0 + ); + }, } } -} </script> <style scoped> -.table2{ - width: 100%; - height: 100%; - overflow: auto; -} -.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: 2; -} -.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; + .table2 { + width: 100%; + height: 100%; + overflow: auto; } -} -@media screen and (min-width: 1680px) and (max-width: 1920px){ - #Efficiency{ - height: 687px!important; - overflow: scroll; + + .table2 thead tr th:first-child, + .table tbody tr .tdgu { + position: sticky; + left: 0; + z-index: 1; } -} -@media screen and (min-width: 1400px) and (max-width: 1680px){ - #Efficiency{ - height: 540px!important; - overflow: scroll; + + .table tbody tr .wenzi { + /*writing-mode: vertical-lr;*/ + /*text-orientation: upright;*/ + transform: rotate(360deg); + writing-mode: vertical-lr; + letter-spacing: 2px; } -} -@media screen and (min-width: 1280px) and (max-width: 1400px){ - #Efficiency{ - height: 440px!important; - overflow: scroll; + + .table tbody tr .kaitou { + z-index: 1; + background-color: white; } -} -@media screen and (max-width: 1280px){ - #Efficiency{ - height: 440px!important; - overflow: scroll; + + .table tbody tr .tdgu1 { + position: sticky; + left: 50px; + z-index: 2; } -} -#Efficiency .table_guding1{ - position: absolute; - overflow: hidden; - width: 500px; -} -#Efficiency .table_guding2{ - overflow-x: scroll; - width: 500px; -} -.identifyingclass { - width: 55px; - height: 15px; - display: inline-block -} -.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; -} + .table tbody tr .tdgu2 { + position: sticky; + left: 100px; + z-index: 2; + } -/*.dataContent .fixed th {*/ -/*width: 50px;*/ -/*}*/ + .table tbody tr .tdgu3 { + position: sticky; + left: 150px; + z-index: 2; + } -.dataContent .thead th { - background-color: #fafafa; - text-align: center; - height: 30px; - padding: 5px; -} + .table tbody tr .tdgu4 { + position: sticky; + left: 250px; + z-index: 2; + } -.dataContent .notfixed th { - /*width: auto;*/ -} + .table tbody tr .tdgu5 { + position: sticky; + left: 412px; + z-index: 2; + } -.dataContent tr td { - height: 35px; -} + .table2 thead tr .timeth, + .table2 thead tr .thgu { + position: sticky; + top: 0; + z-index: 3; + } -.dataContent .mathData td { - padding: 10px; - /*display: none;*/ -} + .table2 thead .gudingth th { + position: sticky; + top: 32px; + z-index: 2; + } -.dataContent .mathData .td { - /*background-color: #ff9bd2;*/ - display: inline-block; - padding: 10px; -} + .table2 thead .equipname .name { + z-index: 3; + } -.dataContent .mathData .tdd { - /*display: none;*/ -} -td { - vertical-align: middle; -} -.pink { - background-color: #ff9bd2; -} + .table2 thead .equipname .dong1 { + z-index: 4; + left: 0; + } -.yellow { - background-color: #e8ff37; -} + .table2 thead .equipname .dong2 { + z-index: 5; + left: 50px; + } -.green { - background-color: #99ff4e; -} + .table2 thead .equipname .dong3 { + z-index: 5; + left: 100px; + } + + .table2 thead .equipname .dong4 { + z-index: 5; + left: 150px; + } + + .table2 thead .equipname .dong5 { + z-index: 5; + left: 250px; + } + + .table2 thead .equipname .dong6 { + z-index: 5; + left: 412px; + } + + #Efficiency { + overflow: hidden; + } + + @media screen and (min-width: 1920px) { + #Efficiency { + height: 687px !important; + } + } + + @media screen and (min-width: 1680px) and (max-width: 1920px) { + #Efficiency { + height: 687px !important; + } + } + + @media screen and (min-width: 1400px) and (max-width: 1680px) { + #Efficiency { + height: 540px !important; + } + } + + @media screen and (min-width: 1280px) and (max-width: 1400px) { + #Efficiency { + height: 440px !important; + } + } + + @media screen and (max-width: 1280px) { + #Efficiency { + height: 440px !important; + } + } + + .identifyingclass { + width: 55px; + height: 15px; + display: inline-block + } + + .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 .thead th { + background-color: #fafafa; + text-align: center; + height: 30px; + padding: 5px; + } + + .dataContent .mathData td { + padding: 10px; + } + + td { + vertical-align: middle; + } </style> \ No newline at end of file -- Gitblit v1.9.3