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/efficiencyShiftReport/EfficiencyShiftList.vue | 741 +++++++++++++++++++++++++++++++++----------------------- 1 files changed, 441 insertions(+), 300 deletions(-) diff --git a/src/views/mdc/base/modules/efficiencyShiftReport/EfficiencyShiftList.vue b/src/views/mdc/base/modules/efficiencyShiftReport/EfficiencyShiftList.vue index e37659d..3f7e5b5 100644 --- a/src/views/mdc/base/modules/efficiencyShiftReport/EfficiencyShiftList.vue +++ b/src/views/mdc/base/modules/efficiencyShiftReport/EfficiencyShiftList.vue @@ -1,149 +1,233 @@ <template> <div style="width: 100%;"> - <a-card :bordered="false"> + <div :bordered="false"> <!-- 鏌ヨ鍖哄煙 --> <div class="seach-content"> <div class="table-page-search-wrapper"> - <a-form layout="inline" @keyup.enter.native="searchQuery"> - <a-row :gutter="24"> - <a-col :md="9" :sm="9" :xs="9"> - <a-form-item label="鏃堕棿"> - <a-range-picker @change="dateParamChange" :disabledDate="disabledDate" format="YYYYMMDD" v-model="dates"/> - </a-form-item> - </a-col> - <a-col :md="6" :sm="6" :xs="6"> - <a-form-item label="鐝埗"> - <a-select v-model="queryParam.shiftId" placeholder="璇烽�夋嫨鐝埗" - @change="initShiftSubList" :allowClear = "allowClear"> - <a-select-option v-for="(em,index) in shiftList" :key="index" :value="em.value"> - {{ em.label }} - </a-select-option> - </a-select> - </a-form-item> - </a-col> - <a-col :md="6" :sm="6" :xs="6"> - <a-form-item label="鐝"> - <a-select v-model="queryParam.shiftSubId" placeholder="璇烽�夋嫨鐝" @change="initShiftSubListChange" :allowClear = "allowClearSu"> - <a-select-option v-for="(em,index) in shiftSubList" :key="index" :value="em.value"> - {{ em.label }} - </a-select-option> - </a-select> - </a-form-item> - </a-col> + <a-form layout="inline" @keyup.enter.native="searchQuery"> + <a-row :gutter="24"> + <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 :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 :md="6" :sm="6" :xs="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="4" :sm="4" :xs="4"> + <a-form-item label="鐝埗"> + <a-select v-model="queryParam.shiftId" placeholder="璇烽�夋嫨鐝埗" + @change="initShiftSubList" :allowClear="allowClear"> + <a-select-option v-for="(em,index) in shiftList" :key="index" :value="em.value"> + {{ em.label }} + </a-select-option> + </a-select> + </a-form-item> + </a-col> + <a-col :md="4" :sm="4" :xs="4"> + <a-form-item label="鐝"> + <a-select v-model="queryParam.shiftSubId" placeholder="璇烽�夋嫨鐝" @change="initShiftSubListChange" + :allowClear="allowClearSu"> + <a-select-option v-for="(em,index) in shiftSubList" :key="index" :value="em.value"> + {{ em.label }} + </a-select-option> + </a-select> + </a-form-item> + </a-col> + <a-col :md="2" :sm="2"> + <a + @click="toggleSearchStatus=!toggleSearchStatus" + style="display:block;height: 32px;display: flex;align-items: center" + > + {{ toggleSearchStatus ? '鏀惰捣' : '灞曞紑' }} + <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/> + </a> + </a-col> + </a-row> - </a-row> - <a-row :gutter="24"> - <a-col :md="15" :sm="15" :xs="15"> - <a-checkbox-group :value="checkedList" :default-value="['lyl']" :options="efficiencyOptions" - @change="efficiencyOptionsOnChange"/> - </a-col> - <a-col :md="3" :sm="3" :xs="3"> - <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> - </a-col> - <a-col :md="3" :sm="3" :xs="3"> - <a-button type="primary" @click="searchReset" icon="reload">閲嶇疆</a-button> - </a-col> - <a-col :md="3" :sm="3" :xs="3"> - <a-button type="primary" @click="exportExcel" icon="download">瀵煎嚭</a-button> - </a-col> - </a-row> - </a-form> - </div> - <div style="width: 530px;top: 20px; right: 0px;"> - <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> - </div> - </div> - <div class="container" id="EfficiencyShift" 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: 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: 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 class="thgu dong7 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> - <!--average--> - <!--<th class="thgu dong4 name" rowspan="2" style="min-width: 100px; max-width: 150px;width: 150px;">骞冲潎鍊�(鐝鍒╃敤鐜�)</th>--> + <a-row :gutter="24" v-if="toggleSearchStatus"> + <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> - </tr> - <tr class="thead notfixed gudingth"> - <template v-for="(tableHead, index) in tableHeads"> - <th>鐝鍒╃敤鐜�(%)</th> - <!--<th v-if="checkedList.indexOf('gzl') > -1">鏁呴殰鐜�(%)</th>--> - <!--<th v-if="checkedList.indexOf('processingLong') > -1">杩愯鏃堕棿(s)</th>--> - <!--<th v-if="checkedList.indexOf('totalLong') > -1">鏈夋晥鏃堕棿(s)</th>--> - <!--<th v-if="checkedList.indexOf('faultLong') > -1">鏁呴殰鏃堕棿(s)</th>--> - <!--<!–<th v-if="checkedList.indexOf('gjsj') > -1">鍏虫満鏃堕棿(s)</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> -<!-- <tr>--> -<!-- <th rowspan="2">骞冲潎鍊�</th>--> -<!-- </tr>--> - </thead> - <tbody> - <tr class="mathData" v-for="(item, index) in dataList"> - <td class="tdgu kaitou wenzi" :rowspan="item.level1span" :class="{hidden: item.level1dis,noExl:item.level1dis}" v-show="!item.level1dis">{{item.level1}}</td> - <td class="tdgu1 kaitou wenzi" :rowspan="item.level2span" :class="{hidden: item.level2dis,noExl:item.level2dis}" v-show="!item.level2dis">{{item.level2}}</td> - <td class="tdgu2 kaitou wenzi" :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> - <td class="tdgu6 kaitou">{{item.shiftSubName}}</td> - - <!--<td>{{item.tierType}}</td>--> - <template v-for="(tableHead, index) in item.dataList"> - <!--<td :style="{background:tableHead.color }" v-if='tableHead.utilizationRate !== 0'>{{tableHead.utilizationRate | numFilter}}</td>--> - <!--<td :style="{background:tableHead.color }" v-if='tableHead.lyl == 0 && tableHead.status == 1'>缁翠慨</td>--> - <!--<td :style="{background:tableHead.color }" v-if='tableHead.lyl == 0 && tableHead.status == 2'>浼戠彮</td>--> - <!--<td :style="{background:tableHead.color }" v-if='tableHead.lyl == 0 && tableHead.status == 10'>{{tableHead.lyl | numFilter}}</td>--> - <!--<td :style="{background:tableHead.color }" v-if='tableHead.lyl == 0 && tableHead.status == 11'>鏈绠�</td>--> - <!--<td :style="{background:tableHead.color }" v-if='tableHead.lyl == 0 && tableHead.status == 12'>鏃犵彮娆�</td>--> - <td :style="{background:tableHead.color }">{{tableHead.utilizationRate | numFilter}}</td> - <!--<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('gzl') > -1">--> - <!--{{tableHead.gzl | 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> - <!--<td :style="{background:item[tableHead].color }" v-if="checkedList.indexOf('gjsj') > -1">--> - <!--{{item[tableHead].gjsj}}--> - <!--</td>--> - </template> - <!--<td :style="{background:item.average.color }" >{{item.average.lyl | numFilter}}</td>--> - </tr> - </tbody> - </table> + <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="'#EfficiencyShift'" + v-has="'efficiencyShiftReport: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-row> + </a-form> </div> + <!--<div style="width: 530px;position:absolute;top: 10px; right: 0;">--> + <!--<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>--> + <!--</div>--> </div> - </a-card> + <a-spin :spinning="spinning"> + <div class="container" id="EfficiencyShift" 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 class="thgu dong7 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> + <!--average--> + <!--<th class="thgu dong4 name" rowspan="2" style="min-width: 100px; max-width: 150px;width: 150px;">骞冲潎鍊�(鐝鍒╃敤鐜�)</th>--> + + </tr> + <tr class="thead notfixed gudingth"> + <template v-for="(tableHead, index) in tableHeads"> + <th>鐝鍒╃敤鐜�(%)</th> + <!--<th v-if="checkedList.indexOf('gzl') > -1">鏁呴殰鐜�(%)</th>--> + <!--<th v-if="checkedList.indexOf('processingLong') > -1">杩愯鏃堕棿(s)</th>--> + <!--<th v-if="checkedList.indexOf('totalLong') > -1">鏈夋晥鏃堕棿(s)</th>--> + <!--<th v-if="checkedList.indexOf('faultLong') > -1">鏁呴殰鏃堕棿(s)</th>--> + <!--<!–<th v-if="checkedList.indexOf('gjsj') > -1">鍏虫満鏃堕棿(s)</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" :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> + <td class="tdgu6 kaitou">{{item.shiftSubName}}</td> + </template> + + <template v-else> + <td colspan="7" class="tdgu kaitou">{{item.level1}}</td> + </template> + <!--<td>{{item.tierType}}</td>--> + <template v-for="(tableHead, index) in item.dataList"> + <!--<td :style="{background:tableHead.color }" v-if='tableHead.utilizationRate !== 0'>{{tableHead.utilizationRate | numFilter}}</td>--> + <!--<td :style="{background:tableHead.color }" v-if='tableHead.lyl == 0 && tableHead.status == 1'>缁翠慨</td>--> + <!--<td :style="{background:tableHead.color }" v-if='tableHead.lyl == 0 && tableHead.status == 2'>浼戠彮</td>--> + <!--<td :style="{background:tableHead.color }" v-if='tableHead.lyl == 0 && tableHead.status == 10'>{{tableHead.lyl | numFilter}}</td>--> + <!--<td :style="{background:tableHead.color }" v-if='tableHead.lyl == 0 && tableHead.status == 11'>鏈绠�</td>--> + <!--<td :style="{background:tableHead.color }" v-if='tableHead.lyl == 0 && tableHead.status == 12'>鏃犵彮娆�</td>--> + <td :style="{background:tableHead.color }">{{tableHead.utilizationRate | numFilter}}</td> + <!--<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('gzl') > -1">--> + <!--{{tableHead.gzl | 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> + <!--<td :style="{background:item[tableHead].color }" v-if="checkedList.indexOf('gjsj') > -1">--> + <!--{{item[tableHead].gjsj}}--> + <!--</td>--> + </template> + <!--<td :style="{background:item.average.color }" >{{item.average.lyl | numFilter}}</td>--> + </tr> + </tbody> + </table> + </div> + </div> + </a-spin> + </div> </div> </template> @@ -153,21 +237,25 @@ import $ from 'jquery' import '@/components/table2excel/table2excel' import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api' + import api from '@/api/mdc' + export default { name: 'EfficiencyShiftList', components: {}, data() { return { - typeTree:"", - typeParent:1, - typeEquipment:1, - allowClear:true, - allowClearSu:true, + typeTree: '', + typeParent: 1, + typeEquipment: 1, + allowClear: true, + allowClearSu: true, dates: [], + selectList: [], + driveTypeList: [], identifying: [], queryParam: {}, - queryParamEquip:{}, - queryParamPeople:{}, + queryParamEquip: {}, + queryParamPeople: {}, efficiencyOptions: [ { label: '鐝鍒╃敤鐜�', value: 'lyl' }, // { label: '鏁呴殰鐜�', value: 'gzl' }, @@ -186,30 +274,35 @@ list: '/mdc/efficiencyReport/efficiencyShiftList', listByType: '/mdc/MdcUtilizationRate/getByType', initShiftList: '/mdc/mdcMdcShift/initShiftList', - initShiftSubList: '/mdc/mdcShiftSub/initShiftSubList' + initShiftSubList: '/mdc/mdcShiftSub/initShiftSubList', + queryEquipmentType: '/mdc/mdcEquipmentType/queryEquipmentType' }, tableHeads: [], shiftList: [], - shiftSubList: [] + shiftSubList: [], + spinning: false, + toggleSearchStatus: false } }, - props: { nodeTree: '', Type:'',nodePeople: '' }, + props: { nodeTree: '', Type: '', nodePeople: '' }, created() { this.initShiftList() this.showIdentifying() this.dates = [moment().subtract('days', 7), 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.queryParam.typeTree = '1' + this.loadData() + this.queryGroup() + this.getDriveTypeByApi() }, watch: { - Type(valmath){ - this.dataList = []; + Type(valmath) { + this.dataList = [] this.queryParam.typeTree = valmath }, nodeTree(val) { //鐩戝惉currSelected 鍙樺寲锛屽皢鍙樺寲鍚庣殑鏁板�间紶閫掔粰 getCurrSelected 浜嬩欢 - console.log(val); + console.log(val) if (JSON.stringify(val) != '{}') { if (val.equipmentId != null) { this.queryParamEquip.parentId = '' @@ -221,7 +314,7 @@ this.searchQuery() } }, - nodePeople(val){ + nodePeople(val) { if (JSON.stringify(val) != '{}') { if (val.equipmentId != null) { this.queryParamPeople.parentId = val.equipmentId @@ -241,67 +334,80 @@ } else { return '0' } + }, + + /** + * 鏍煎紡鍖栨椂闂� + * @param seconds 绉掓暟 + * @returns '' 鏍煎紡鍖栧悗鏃堕棿瀛楃涓� + */ + getFormattedTime(seconds) { + if (seconds) { + return parseFloat((seconds / 3600).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){ + 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{ + } else { cache[level1] = indices.length indices.push([index]) } }) - let result = []; - indices.map((item)=>{ - item.map((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){ + 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{ + } else { cache[level2] = indices.length indices.push([index]) } }) - let result = []; - indices.map((item)=>{ - item.map((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){ + 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{ + } else { cache[level3] = indices.length indices.push([index]) } }) - let result = []; - indices.map((item)=>{ - item.map((index)=>{ + let result = [] + indices.map((item) => { + item.map((index) => { result.push(dataList[index]) }) }) @@ -310,30 +416,30 @@ // 鍚堝苟 combineCell() { console.log(this.dataList) - let list =this.dataList; + let list = this.dataList for (let field in list[0]) { - var k = 0; + var k = 0 while (k < list.length) { - list[k][field + 'span'] = 1; - list[k][field + 'dis'] = false; + 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; + list[k][field + 'span']++ + list[k][field + 'dis'] = false + list[i][field + 'span'] = 1 + list[i][field + 'dis'] = true } else { - break; + break } } - k = i; + k = i } } - return list; + return list }, - disabledDate(current){ + disabledDate(current) { //Can not slect days before today and today - return current && current > moment().subtract('days', 1); + return current && current > moment().subtract('days', 1) }, initDeviceType(deviceList) { let dictCode = 'mdc_equipmentType' @@ -371,17 +477,17 @@ }, initShiftSubList(val) { //姣忔閲嶆柊閫夋嫨鐝埗鏃剁彮娆℃竻绌轰笖鏄剧ずplaceholder鍐呭 - this.queryParam.shiftSubId = undefined; + this.queryParam.shiftSubId = undefined getAction(this.url.initShiftSubList, { shiftId: val }).then((res) => { if (res.success) { - this.shiftSubList = res.result; + this.shiftSubList = res.result } }) }, initShiftSubListChange() { getAction(this.url.initShiftSubList, { shiftId: this.queryParam.shiftId }).then((res) => { if (res.success) { - this.shiftSubList = res.result; + this.shiftSubList = res.result } }) }, @@ -406,196 +512,258 @@ 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:"涓嶈兘鍙栨秷鏌ヨ鐝鍒╃敤鐜�" + message: '娑堟伅', + description: '涓嶈兘鍙栨秷鏌ヨ鐝鍒╃敤鐜�' }) return false } this.checkedList = checkedList }, searchQuery() { - 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.$message.warning("璇烽�夋嫨鏃堕棿") - console.log('瑙﹀彂鎻愮ず') - this.$notification.warning({ - message:'娑堟伅', - description:"璇烽�夋嫨鏃堕棿" - }); + 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.typeParent = this.queryParam.parentId this.typeEquipment = this.queryParam.equipmentId this.queryParam = {} - this.dates = [] + this.dates = [moment().subtract('days', 7), 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 = this.typeTree this.queryParam.parentId = this.typeParent - this.queryParam.equipmentId = this.typeEquipment + this.queryParam.equipmentId = this.typeEquipment this.loadData() // this.onClearSelected() }, loadData() { + this.spinning = true 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 + if (res.result.mdcEfficiencyList && !res.result.mdcEfficiencyList.length) { + this.$notification.info({ + message: '娑堟伅', + description: '鏆傛棤璇ヨ澶囩被鍨嬫暟鎹�' + }) + } this.checkSameData(this.dataList) this.checkSameData1(this.dataList) this.checkSameData2(this.dataList) - this.combineCell(); + this.combineCell() // 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{ + .table2 { width: 100%; height: 100%; overflow: auto; } + .table2 thead tr th:first-child, - .table tbody tr .tdgu{ + .table tbody tr .tdgu { position: sticky; left: 0; z-index: 1; } - .table tbody tr .wenzi{ + + .table tbody tr .wenzi { /*writing-mode: vertical-lr;*/ /*text-orientation: upright;*/ transform: rotate(360deg); writing-mode: vertical-lr; letter-spacing: 2px; } - .table tbody tr .kaitou{ + + .table tbody tr .kaitou { z-index: 1; background-color: white; } - .table tbody tr .tdgu1{ + + .table tbody tr .tdgu1 { position: sticky; left: 50px; z-index: 2; } - .table tbody tr .tdgu2{ + + .table tbody tr .tdgu2 { position: sticky; left: 100px; z-index: 2; } - .table tbody tr .tdgu3{ + + .table tbody tr .tdgu3 { position: sticky; left: 150px; z-index: 2; } - .table tbody tr .tdgu4{ + + .table tbody tr .tdgu4 { position: sticky; left: 250px; z-index: 2; } - .table tbody tr .tdgu5{ + + .table tbody tr .tdgu5 { position: sticky; - left: 400px; + left: 412px; z-index: 2; } - .table tbody tr .tdgu6{ + + .table tbody tr .tdgu6 { position: sticky; - left: 500px; + left: 512px; z-index: 2; } .table2 thead tr .timeth, - .table2 thead tr .thgu { + .table2 thead tr .thgu { position: sticky; - top:0; + top: 0; z-index: 3; } - .table2 thead .gudingth th{ + + .table2 thead .gudingth th { position: sticky; top: 32px; z-index: 2; } - .table2 thead .equipname .name{ + + .table2 thead .equipname .name { z-index: 3; } - .table2 thead .equipname .dong1{ + + .table2 thead .equipname .dong1 { z-index: 4; left: 0; - /*border: 1px solid #000;*/ } - .table2 thead .equipname .dong2{ + + .table2 thead .equipname .dong2 { z-index: 5; left: 50px; } - .table2 thead .equipname .dong3{ + + .table2 thead .equipname .dong3 { z-index: 5; left: 100px; } - .table2 thead .equipname .dong4{ + + .table2 thead .equipname .dong4 { z-index: 5; left: 150px; } - .table2 thead .equipname .dong5{ + + .table2 thead .equipname .dong5 { z-index: 5; left: 250px; } - .table2 thead .equipname .dong6{ + + .table2 thead .equipname .dong6 { z-index: 5; - left: 400px; - } - .table2 thead .equipname .dong7{ - z-index: 6; - left: 500px; + left: 412px; } - @media screen and (min-width: 1920px){ - #EfficiencyShift{ - height: 670px!important; - overflow: scroll; + .table2 thead .equipname .dong7 { + z-index: 6; + left: 512px; + } + + #EfficiencyShift { + overflow: hidden; + } + + @media screen and (min-width: 1920px) { + #EfficiencyShift { + height: 670px !important; } } - @media screen and (min-width: 1680px) and (max-width: 1920px){ - #EfficiencyShift{ - height: 670px!important; - overflow: scroll; + + @media screen and (min-width: 1680px) and (max-width: 1920px) { + #EfficiencyShift { + height: 670px !important; } } - @media screen and (min-width: 1400px) and (max-width: 1680px){ - #EfficiencyShift{ - height: 522px!important; - overflow: scroll; + + @media screen and (min-width: 1400px) and (max-width: 1680px) { + #EfficiencyShift { + height: 522px !important; } } - @media screen and (min-width: 1280px) and (max-width: 1400px){ - #EfficiencyShift{ - height: 414px!important; - overflow: scroll; + + @media screen and (min-width: 1280px) and (max-width: 1400px) { + #EfficiencyShift { + height: 414px !important; } } - @media screen and (max-width: 1280px){ - #EfficiencyShift{ - height: 414px!important; - overflow: scroll; + + @media screen and (max-width: 1280px) { + #EfficiencyShift { + height: 414px !important; } } @@ -621,10 +789,6 @@ text-align: center; } - .dataContent .fixed th { - width: 50px; - } - .dataContent .thead th { background-color: #fafafa; text-align: center; @@ -632,31 +796,8 @@ padding: 5px; } - .dataContent .notfixed th { - width: auto; - } - - /*.dataContent tr td {*/ - /*height: 35px*/ - /*}*/ - .dataContent .mathData td { padding: 10px; - /*display: none;*/ - } - - .dataContent .mathData .td { - /*background-color: #ff9bd2;*/ - display: inline-block; - padding: 10px; - } - - .dataContent .mathData .tdd { - /*display: none;*/ - } - .seach-content{ - display: flex; - justify-content: space-between; } </style> \ No newline at end of file -- Gitblit v1.9.3