From accebdce93486d3b4f26e55ffdea047549cce20c Mon Sep 17 00:00:00 2001 From: cuijian <cuijian@xalxzn.com> Date: 星期一, 28 七月 2025 21:12:38 +0800 Subject: [PATCH] Merge branch 'master' of http://125.76.225.53:18448/r/xhj/vue_mdc_xhj --- src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue | 673 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 673 insertions(+), 0 deletions(-) diff --git a/src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue b/src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue new file mode 100644 index 0000000..cb17612 --- /dev/null +++ b/src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue @@ -0,0 +1,673 @@ +<template> + <div style="width: 100%;"> + <div :bordered="false"> + <!-- 鏌ヨ鍖哄煙 --> + <div class="table-page-search-wrapper"> + <a-form layout="inline" @keyup.enter.native="searchQuery"> + <a-row :gutter="24"> + <a-col :md="5" :sm="5"> + <a-form-item label="璁惧绫诲瀷"> + <a-select + :value="queryParams.equipmentType" + mode="multiple" + placeholder="璇烽�夋嫨璁惧绫诲瀷" + allow-clear + :maxTagCount="1" + @change="selectChange($event,'equipmentType')" + > + <a-select-option v-for="(item,index) in equipmentTypeList" :value="item.value" :key="index"> + {{item.label}} + </a-select-option> + </a-select> + </a-form-item> + </a-col> + <a-col :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="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-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> + <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> + <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;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> + <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 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> + <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 style="min-width: 162px; max-width: 162px;width: 162px;" class="tdgu4 kaitou">{{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 }" 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> + <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> + </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' +import api from '@/api/mdc' + +export default { + name: 'EfficiencyPOList', + components: {}, + data() { + return { + typeTree:"", + typeParent:1, + typeEquipment:1, + dates: [], + equipmentTypeList:[], + driveTypeList:[], + queryParam: {}, + queryParams: { + equipmentType: [], + driveType: [], + }, + queryParamEquip:{}, + queryParamPeople:{}, + identifying: [], + 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/efficiencyPOList', + listByType: '/mdc/MdcUtilizationRate/getByType', + queryEquipmentType: '/mdc/mdcEquipmentType/queryEquipmentType' + }, + tableHeads: [], + spinning:false + } + }, + 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() + }, + mounted() { + window.addEventListener('resize', this.handleWindowResize) + this.handleWindowResize() + }, + 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' + } + }, + + /** + * 鏍煎紡鍖栨椂闂� + * @param seconds 绉掓暟 + * @returns '' 鏍煎紡鍖栧悗鏃堕棿瀛楃涓� + */ + getFormattedTime(seconds) { + if (seconds) { + return parseFloat((seconds / 3600).toFixed(2)) + } else { + return '0' + } + }, + }, + methods: { + selectChange(value, key) { + this.queryParams[key] = value + }, + 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; + } + } + 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() { + $("#EfficiencyPO").table2excel({ + exclude: ".noExl", + name: "Excel Document Name", + filename: "璁惧寮�鍔ㄧ巼", + exclude_img: true, + fileext: ".xls", + exclude_links: true, + exclude_inputs: true + }); + }, + showIdentifying() { + getAction(this.url.listByType, { type: 'kdl' }).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.parentId = this.queryParamEquip.parentId + this.queryParam.equipmentId = this.queryParamEquip.equipmentId + }else{ + this.queryParam.parentId = this.queryParamPeople.parentId + this.queryParam.equipmentId = "" + } + 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.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: [], + } + this.loadData(); + }, + loadData() { + this.spinning=true + this.tableHeads = [] + this.dataList = [] + getAction(this.url.list, this.queryParam).then(res => { + if (res.success) { + // 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) + this.combineCell(); + // this.initDeviceType(this.dataList) + } + }).finally(()=>{ + this.spinning=false + }) + }, + queryGroup() { + getAction(this.url.queryEquipmentType).then(res => { + if (res.success) { + this.equipmentTypeList = res.result.map(item => { + return { + label: item.equipmentTypeName, + value: item.equipmentTypeName + } + }) + } else { + // this.$message.warning(res.message) + this.$notification.warning({ + message: '娑堟伅', + description: res.message + }) + } + }).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' + } + } +} +</script> +<style scoped> +/*table鏍峰紡*/ +.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 .wenzi{ + /*writing-mode: vertical-lr;*/ + /*text-orientation: upright;*/ + transform: rotate(360deg); + writing-mode: vertical-lr; + letter-spacing: 2px; +} + +.table tbody tr .kaitou{ + z-index: 1; + background-color: white; +} + +.table tbody tr .tdgu1{ + position: sticky; + left: 50px; + z-index: 2; +} + +.table tbody tr .tdgu2{ + position: sticky; + left: 100px; + z-index: 2; +} + +.table tbody tr .tdgu3{ + position: sticky; + left: 150px; + z-index: 2; +} + +.table tbody tr .tdgu4{ + position: sticky; + left: 250px; + z-index: 2; +} + +.table tbody tr .tdgu5{ + position: sticky; + left: 412px; + 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; +} + +.table2 thead .equipname .dong2{ + z-index: 5; + left: 50px; +} + + +.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; +} + +#EfficiencyPO{ + overflow: hidden; +} + +.identifyingclass { + width: 55px; + height: 15px; + display: inline-block +} + +.dataContent { + white-space: nowrap; + /*margin: 0;*/ + 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 .notfixed th { + width: auto; +} + +.dataContent .mathData td { + padding: 10px; +} +</style> \ No newline at end of file -- Gitblit v1.9.3