| | |
| | | </div> |
| | | <table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;"> |
| | | <tr> |
| | | <td v-for="(item, index) in identifying">{{item.title}}</td> |
| | | <td v-for="(item, index) in identifying" |
| | | style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap">{{item.title}} |
| | | </td> |
| | | </tr> |
| | | <tr> |
| | | <td style="text-align:center;" v-for="(item, index) in identifying"> |
| | |
| | | </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: 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> |
| | | |
| | | <a-spin :spinning="spinning"> |
| | |
| | | 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;">设备编号 |
| | |
| | | </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> |
| | |
| | | </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('lyl') > -1"> |
| | | {{tableHead.utilizationRate | numFilter}} |
| | | </td> |
| | | <td :style="{background:tableHead.color }" v-if="checkedList.indexOf('kjl') > -1"> |
| | | {{tableHead.openRate | numFilter}} |
| | | </td> |
| | |
| | | deviceTypeDict: '', |
| | | dates: [], |
| | | selectList: [], |
| | | driveTypeList:[], |
| | | driveTypeList: [], |
| | | identifying: [], |
| | | queryParam: {}, |
| | | queryParams: {}, |
| | |
| | | this.loadData() |
| | | this.queryGroup() |
| | | this.getDriveTypeByApi() |
| | | }, |
| | | mounted() { |
| | | window.addEventListener('resize', this.handleWindowResize) |
| | | this.handleWindowResize() |
| | | }, |
| | | watch: { |
| | | Type(valmath) { |
| | |
| | | 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.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 != '') { |
| | |
| | | /** |
| | | * 调用接口获取控制系统类型 |
| | | */ |
| | | getDriveTypeByApi(){ |
| | | api.getDriveTypeApi().then((res)=>{ |
| | | this.driveTypeList=res.result.map(item=>item.value) |
| | | getDriveTypeByApi() { |
| | | api.getDriveTypeApi().then((res) => { |
| | | this.driveTypeList = res.result.map(item => item.value) |
| | | }) |
| | | }, |
| | | |
| | |
| | | filterOption(input, option) { |
| | | return ( |
| | | option.componentOptions.children[0].text.toUpperCase().indexOf(input.toUpperCase()) >= 0 |
| | | ); |
| | | ) |
| | | }, |
| | | |
| | | /** |
| | | * 分辨率改变时同时改变表格高度已保证首页一进入不拖动垂直滚动条时即可拖动表格水平滚动条 |
| | | */ |
| | | handleWindowResize() { |
| | | const tableContainer = document.getElementById('Efficiency') |
| | | const clientHeight = document.body.clientHeight |
| | | const containerTopToClientTopHeight = tableContainer.getBoundingClientRect().top |
| | | tableContainer.style.height = (clientHeight - containerTopToClientTopHeight - 32) + 'px' |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | |
| | | #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 { |