From b66eab74b627b0e3746f5cb4f6a7d7cb142e9a6d Mon Sep 17 00:00:00 2001 From: zhaowei <zhaowei> Date: 星期四, 01 八月 2024 10:36:42 +0800 Subject: [PATCH] OEE综合效率分析页面删除加工数量和标准加工时间字段 --- src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue | 281 +++++++++++++++++++++++++++++++++++-------------------- 1 files changed, 178 insertions(+), 103 deletions(-) diff --git a/src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue b/src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue index be9c4d5..8253a9b 100644 --- a/src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue +++ b/src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue @@ -5,27 +5,92 @@ <div class="table-page-search-wrapper"> <a-form layout="inline" @keyup.enter.native="searchQuery"> <a-row :gutter="24"> - <a-col :md="4" :sm="4"> + <a-col :md="5" :sm="5"> <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 + :value="queryParams.equipmentType" + mode="multiple" + placeholder="璇烽�夋嫨璁惧绫诲瀷" + allow-clear + :maxTagCount="1" + @change="selectChange($event,'equipmentType')" + > + <a-select-option v-for="(item,index) in equipmentTypeList" :value="item.value" :key="index"> + {{item.label}} </a-select-option> </a-select> </a-form-item> </a-col> - <a-col :md="6" :sm="6"> - <a-form-item label="鏃堕棿"> - <a-range-picker @change="dateParamChange" :disabledDate="disabledDate" format="YYYYMMDD" v-model="dates"/> + <a-col :md="5" :sm="5"> + <a-form-item label="椹卞姩绫诲瀷"> + <a-select + :value="queryParams.driveType" + mode="multiple" + placeholder="璇烽�夋嫨椹卞姩绫诲瀷" + allow-clear + :maxTagCount="1" + @change="selectChange($event,'driveType')" + > + <a-select-option v-for="(item,index) in driveTypeList" :value="item.value" :key="index"> + {{item.label}} + </a-select-option> + </a-select> </a-form-item> </a-col> - <a-col :md="14" :sm="14" style="display: flex;align-items: flex-start;-webkit-align-items: flex-start;justify-content: space-between;"> - <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-space> - <table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;margin-left: 24px"> + <a-col :md="4" :sm="4"> + <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="5" :sm="5" :xs="5"> + <a-form-item label="璁惧绾у埆"> + <a-select + :value="queryParams.deviceLevel" + mode="multiple" + placeholder="璇烽�夋嫨璁惧绾у埆" + allow-clear + :maxTagCount="1" + @change="selectChange($event,'deviceLevel')" + > + <a-select-option v-for="(item,index) in device_level_list" :value="item.value" :key="index"> + {{item.label}} + </a-select-option> + </a-select> + </a-form-item> + </a-col> + <a-col :md="4" :sm="4" :xs="4"> + <a-form-item label="璁惧绉嶇被"> + <a-select + :value="queryParams.deviceCategory" + mode="multiple" + placeholder="璇烽�夋嫨璁惧绉嶇被" + allow-clear + :maxTagCount="1" + @change="selectChange($event,'deviceCategory')" + > + <a-select-option v-for="(item,index) in device_category_list" :value="item.value" :key="index"> + {{item.label}} + </a-select-option> + </a-select> + </a-form-item> + </a-col> + </a-row> + <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="'#EfficiencyPO'" + v-has="'EfficiencyPO: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> @@ -33,41 +98,19 @@ <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> </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-col> - </a-row> </a-form> </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>--> <a-spin :spinning="spinning"> <div class="container" id="EfficiencyPO" 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 dong1 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;height: 66px">鍏徃</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> @@ -80,7 +123,7 @@ </tr> <tr class="thead notfixed gudingth"> <template v-for="(tableHead, index) in tableHeads"> - <th>寮�鍔ㄧ巼(%)</th> + <th v-if="checkedList.indexOf('lyl') > -1">寮�鍔ㄧ巼(%)</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> @@ -115,9 +158,8 @@ <template v-else> <td colspan="6" class="tdgu kaitou">{{item.level1}}</td> </template> - <!--<td>{{item.tierType}}</td>--> <template v-for="(tableHead, index) in item.dataList"> - <td :style="{background:tableHead.color }">{{tableHead.startRate | numFilter}}</td> + <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('lyl') > -1">{{tableHead.startRate | numFilter}}</td> <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('kjl') > -1"> {{tableHead.openRate | numFilter}} </td> @@ -150,6 +192,8 @@ import $ from 'jquery' import '@/components/table2excel/table2excel' import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api' +import api from '@/api/mdc' + export default { name: 'EfficiencyPOList', components: {}, @@ -159,8 +203,17 @@ typeParent:1, typeEquipment:1, dates: [], - selectList:[], + equipmentTypeList:[], + driveTypeList:[], + device_level_list: [], + device_category_list: [], queryParam: {}, + queryParams: { + equipmentType: [], + driveType: [], + deviceLevel: [], + deviceCategory: [] + }, queryParamEquip:{}, queryParamPeople:{}, identifying: [], @@ -192,6 +245,13 @@ this.queryParam.typeTree = "1" this.loadData() this.queryGroup() + this.getDriveTypeByApi() + this.initDictData('device_level') + this.initDictData('device_category') + }, + mounted() { + window.addEventListener('resize', this.handleWindowResize) + this.handleWindowResize() }, watch: { Type(valmath){ @@ -246,6 +306,23 @@ }, }, methods: { + initDictData(dictCode) { + // //浼樺厛浠庣紦瀛樹腑璇诲彇瀛楀吀閰嶇疆 + if (getDictItemsFromCache(dictCode)) { + this[dictCode + '_list'] = getDictItemsFromCache(dictCode) + return + } + //鏍规嵁瀛楀吀Code, 鍒濆鍖栧瓧鍏告暟缁� + ajaxGetDictItems(dictCode, null).then((res) => { + if (res.success) { + this[dictCode + '_list'] = res.result + return + } + }) + }, + selectChange(value, key) { + this.queryParams[key] = value + }, checkSameData(dataList){ let cache = {}; //瀛樺偍鐨勬槸閿槸kclx 鐨勫�硷紝鍊兼槸kclx 鍦╥ndeces涓暟缁勭殑涓嬫爣 let indices = []; //鏁扮粍涓瘡涓�涓�兼槸涓�涓暟缁勶紝鏁扮粍涓殑姣忎竴涓厓绱犳槸鍘熸暟缁勪腑鐩稿悓kclx鐨勪笅鏍� @@ -389,50 +466,51 @@ 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 - } + // let index = checkedList.indexOf('lyl') + // if (index < 0) { + // // this.$message.warn('涓嶈兘鍙栨秷鏌ヨ鍒╃敤鐜�') + // this.$notification.warning({ + // 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() + if(this.queryParam.typeTree == "1"){ + this.queryParam.parentId = this.queryParamEquip.parentId + this.queryParam.equipmentId = this.queryParamEquip.equipmentId }else{ - this.$notification.warning({ - message:'娑堟伅', - description:"璇烽�夋嫨鏃堕棿" - }); + this.queryParam.parentId = this.queryParamPeople.parentId + this.queryParam.equipmentId = "" } - // this.onClearSelected() + Object.keys(this.queryParams).forEach(item => { + this.queryParam[item] = this.queryParams[item].join() + // 姝ゅ涓轰繚璇佹帴鍙e弬鏁颁笉澶氫綑锛屽彲鐪佺暐 + if (this.queryParams[item].length === 0) delete this.queryParam[item] + }) + this.loadData() }, searchReset() { this.typeTree = this.queryParam.typeTree this.typeParent = this.queryParam.parentId this.typeEquipment = this.queryParam.equipmentId this.queryParam = {} - this.dates = [] this.queryParam.typeTree = this.typeTree this.queryParam.parentId = this.typeParent this.queryParam.equipmentId = this.typeEquipment + this.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.queryParams = { + equipmentType: [], + driveType: [], + deviceLevel: [], + deviceCategory: [] + } this.loadData(); - // this.queryParam = {} - // this.dates = [] - // this.loadData() - // this.onClearSelected() }, loadData() { this.spinning=true @@ -443,6 +521,12 @@ // console.log(res.result) 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) @@ -456,10 +540,12 @@ 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 + '' } - // }) + this.equipmentTypeList = res.result.map(item => { + return { + label: item.equipmentTypeName, + value: item.equipmentTypeName + } + }) } else { // this.$message.warning(res.message) this.$notification.warning({ @@ -470,6 +556,25 @@ }).finally(() => { this.loading = false }) + }, + + /** + * 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷 + */ + getDriveTypeByApi(){ + api.getDriveTypeApi().then((res)=>{ + if (res.success) this.driveTypeList = res.result + }) + }, + + /** + * 鍒嗚鲸鐜囨敼鍙樻椂鍚屾椂鏀瑰彉琛ㄦ牸楂樺害宸蹭繚璇侀椤典竴杩涘叆涓嶆嫋鍔ㄥ瀭鐩存粴鍔ㄦ潯鏃跺嵆鍙嫋鍔ㄨ〃鏍兼按骞虫粴鍔ㄦ潯 + */ + handleWindowResize() { + const tableContainer = document.getElementById('EfficiencyPO') // 琛ㄦ牸瀹瑰櫒 + const clientHeight = document.documentElement.clientHeight || document.body.clientHeight // 娴忚鍣ㄥ彲瑙嗗尯鍩熼珮搴� + const containerTopToClientTopHeight = tableContainer.getBoundingClientRect().top // 琛ㄦ牸瀹瑰櫒椤堕儴鍒版祻瑙堝櫒鍙鍖哄煙椤堕儴鐨勯棿璺� + tableContainer.style.height = (clientHeight - containerTopToClientTopHeight - 32) + 'px' } } } @@ -582,36 +687,6 @@ #EfficiencyPO{ overflow: hidden; -} - -@media screen and (min-width: 1920px){ - #EfficiencyPO{ - height: 687px!important; - } -} - -@media screen and (min-width: 1680px) and (max-width: 1920px){ - #EfficiencyPO{ - height: 687px!important; - } -} - -@media screen and (min-width: 1400px) and (max-width: 1680px){ - #EfficiencyPO{ - height: 540px!important; - } -} - -@media screen and (min-width: 1280px) and (max-width: 1400px){ - #EfficiencyPO{ - height: 440px!important; - } -} - -@media screen and (max-width: 1280px){ - #EfficiencyPO{ - height: 440px!important; - } } .identifyingclass { -- Gitblit v1.9.3