From 3ce2d50102929e6e245249ce61bbadd300f3e24e Mon Sep 17 00:00:00 2001
From: Lius <Lius2225@163.com>
Date: 星期三, 14 八月 2024 16:12:28 +0800
Subject: [PATCH] 设备维护校验调整 OEE列表间距调整
---
src/views/mdc/base/modules/OEEAnalysis/OEEAnalysisList.vue | 127 +++++++++++++++++++++++++++--------------
1 files changed, 83 insertions(+), 44 deletions(-)
diff --git a/src/views/mdc/base/modules/OEEAnalysis/OEEAnalysisList.vue b/src/views/mdc/base/modules/OEEAnalysis/OEEAnalysisList.vue
index c25e547..0833281 100644
--- a/src/views/mdc/base/modules/OEEAnalysis/OEEAnalysisList.vue
+++ b/src/views/mdc/base/modules/OEEAnalysis/OEEAnalysisList.vue
@@ -15,7 +15,7 @@
:maxTagCount="1"
@change="selectChange($event,'equipmentType')"
>
- <a-select-option v-for="item in equipmentTypeList" :value="item.value">
+ <a-select-option v-for="(item,index) in equipmentTypeList" :value="item.value" :key="index">
{{item.label}}
</a-select-option>
</a-select>
@@ -31,7 +31,7 @@
:maxTagCount="1"
@change="selectChange($event,'driveType')"
>
- <a-select-option v-for="item in driveTypeList" :value="item.value">
+ <a-select-option v-for="(item,index) in driveTypeList" :value="item.value" :key="index">
{{item.label}}
</a-select-option>
</a-select>
@@ -47,7 +47,7 @@
:maxTagCount="1"
@change="selectChange($event,'deviceLevel')"
>
- <a-select-option v-for="item in device_level_list" :value="item.value">
+ <a-select-option v-for="(item,index) in device_level_list" :value="item.value" :key="index">
{{item.label}}
</a-select-option>
</a-select>
@@ -63,7 +63,7 @@
:maxTagCount="1"
@change="selectChange($event,'deviceCategory')"
>
- <a-select-option v-for="item in device_category_list" :value="item.value">
+ <a-select-option v-for="(item,index) in device_category_list" :value="item.value" :key="index">
{{item.label}}
</a-select-option>
</a-select>
@@ -101,9 +101,14 @@
</div>
</div>
- <div id="EfficiencyShift" style="flex:1;overflow: hidden">
- <a-table :columns="columns" rowKey="id" :dataSource="dataSource.records" :loading="tableLoading"
- :pagination="false" :scroll="{x:'max-content',y:scrollY}" bordered></a-table>
+ <div id="EfficiencyShift" style="flex:1;overflow: hidden;height: inherit">
+ <a-table :columns="columns" rowKey="id" :dataSource="dataSource.records?dataSource.records:[]"
+ :loading="tableLoading"
+ :pagination="false" :scroll="{x:'max-content',y:scrollY}" bordered>
+ <!--<template slot="equipmentModel" slot-scope="text, record">-->
+ <!--<editable-cell :text="text" @change="onCellChange(record.id, 'equipmentModel', $event)"/>-->
+ <!--</template>-->
+ </a-table>
</div>
<!--<div class="pagination">-->
<!--<a-pagination-->
@@ -129,9 +134,11 @@
import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api'
import api from '@api/mdc'
+ // import EditableCell from './EditableCell.vue'
+
export default {
name: 'OEEAnalysisList',
- components: {},
+ components: { },
data() {
return {
dates: [moment().subtract('month', 1), moment().subtract('month', 1)],
@@ -156,14 +163,20 @@
title: '搴忓彿',
dataIndex: '',
key: 'rowIndex',
- width: 70,
+ width: 60,
align: 'center',
customRender: function(t, r, index) {
return parseInt(index) + 1
}
},
{
- title: '璁惧缁熶竴缂栧彿',
+ title: '杞﹂棿',
+ align: 'center',
+ dataIndex: 'productionName',
+ width: 110
+ },
+ {
+ title: '璁惧缂栧彿',
align: 'center',
dataIndex: 'equipmentId',
width: 120
@@ -171,14 +184,15 @@
{
title: '璁惧鍚嶇О',
align: 'center',
- width: 200,
+ width: 120,
dataIndex: 'equipmentName'
},
{
title: '璁惧鍨嬪彿',
align: 'center',
- width: 110,
- dataIndex: 'equipmentModel'
+ width: 120,
+ dataIndex: 'equipmentModel',
+ scopedSlots: { customRender: 'equipmentModel' }
},
{
title: '鏃ユ湡',
@@ -190,32 +204,31 @@
title: '鐝',
align: 'center',
width: 100,
- dataIndex: 'shift',
- ellipsis: true
+ dataIndex: 'shift'
},
{
title: '姣忕彮灏忔椂',
dataIndex: 'shiftTimeCount',
align: 'center',
- width: 110
+ width: 100
},
{
title: '鍔犵彮鏃堕棿锛堝垎閽燂級',
dataIndex: 'overtime',
align: 'center',
- width: 110
+ width: 100
},
{
title: '瀹為檯鐝骇澶╂暟',
dataIndex: 'actualWorkDayCount',
align: 'center',
- width: 120
+ width: 100
},
{
title: '鏈堝害瀹為檯鐝骇鎬绘椂闂达紙鍒嗛挓锛�',
dataIndex: 'monthActualWorkDayTimeCount',
align: 'center',
- width: 110
+ width: 100
},
{
title: '闈炶鍒掑仠鏈烘崯澶憋紙鍒嗛挓锛夛紙涓�涓湀锛�',
@@ -242,7 +255,7 @@
title: '璁″垝绛変换鍔�',
dataIndex: 'plannedTaskDuration',
align: 'center',
- width: 110
+ width: 100
},
{
title: '妫�楠�',
@@ -271,45 +284,45 @@
title: '浼氳/鍩硅',
dataIndex: 'conferenceTrainingDuration',
align: 'center',
- width: 110
+ width: 100
},
{
title: '鍏朵粬浼戞伅绛�',
dataIndex: 'otherRestDuration',
align: 'center',
- width: 110
+ width: 100
}]
},
{
title: '璐熻嵎鏃堕棿锛堝皬鏃讹級',
dataIndex: 'loadTime',
align: 'center',
- width: 110
+ width: 100
},
{
title: '鏃堕棿寮�鍔ㄧ巼',
dataIndex: 'timeActuationRate',
align: 'center',
- width: 110,
+ width: 100,
customRender: text => text != 0 ? parseFloat((text * 100).toFixed(2)) + '%' : 0
},
- {
- title: '鍔犲伐闆朵欢鏁帮紙浠讹級',
- dataIndex: 'processQuantity',
- align: 'center',
- width: 120
- },
- {
- title: '鏍囧噯鍔犲伐鏃堕棿锛堝垎閽燂級',
- dataIndex: 'standardProcessDuration',
- align: 'center',
- width: 120
- },
+ // {
+ // title: '鍔犲伐闆朵欢鏁帮紙浠讹級',
+ // dataIndex: 'processQuantity',
+ // align: 'center',
+ // width: 120
+ // },
+ // {
+ // title: '鏍囧噯鍔犲伐鏃堕棿锛堝垎閽燂級',
+ // dataIndex: 'standardProcessDuration',
+ // align: 'center',
+ // width: 120
+ // },
{
title: '鎬ц兘寮�鍔ㄧ巼',
dataIndex: 'performanceRate',
align: 'center',
- width: 110,
+ width: 100,
customRender: text => text != 0 ? parseFloat((text * 100).toFixed(2)) + '%' : 0
},
{
@@ -329,7 +342,7 @@
title: '璁惧缁煎悎鏁堢巼',
dataIndex: 'overallEquipmentEfficiency',
align: 'center',
- width: 120,
+ width: 100,
customRender: text => text != 0 ? parseFloat((text * 100).toFixed(2)) + '%' : 0
}
],
@@ -363,7 +376,7 @@
},
mounted() {
window.addEventListener('resize', this.handleWindowResize)
- this.handleWindowResize()
+ // this.handleWindowResize()
},
beforeDestroy() {
window.removeEventListener('resize', this.handleWindowResize)
@@ -508,13 +521,14 @@
this.tableLoading = true
getAction(this.url.list, this.queryParam)
.then(res => {
- if (res.success) {
+ if (res.success && res.result) {
this.dataSource = res.result
this.tableLoading = false
}
})
.finally(() => {
this.tableLoading = false
+ this.handleWindowResize()
})
},
@@ -538,21 +552,40 @@
this.loadData()
},
+ onCellChange(key, dataIndex, value) {
+ console.log('瑙﹀彂onCellChange', key, dataIndex, value)
+ },
+
/**
* 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙�
*/
handleWindowResize() {
const devicePixelRatio = window.devicePixelRatio // 娴忚鍣ㄧ缉鏀炬瘮
+ console.log('devicePixelRatio', devicePixelRatio)
if (devicePixelRatio < 1) return // 缂╂斁姣斿皬浜�1鏃朵笉杩涜楂樺害閲嶆柊璁剧疆锛屽洜涓簊crollY鍙樺ぇ鍚庤〃鏍艰秴鍑洪儴鍒嗕細琚殣钘忓鑷存粴鍔ㄦ潯涓嶅彲瑙�
- const clientHeight = document.body.clientHeight // 娴忚鍣ㄥ彲瑙嗗尯鍩熼珮搴�
+ const clientHeight = document.body.clientHeight || document.documentElement.clientHeight// 娴忚鍣ㄥ彲瑙嗗尯鍩熼珮搴�
+ console.log('clientHeight', clientHeight)
const containerTopToClientTopHeight = document.getElementById('EfficiencyShift').getBoundingClientRect().top // 琛ㄦ牸瀹瑰櫒椤堕儴鍒版祻瑙堝櫒鍙鍖哄煙椤堕儴鐨勯棿璺�
- const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0, -2) // 琛ㄦ牸琛ㄥご楂樺害
- this.scrollY = clientHeight - containerTopToClientTopHeight - tableHeadHeight // 琛ㄦ牸鍨傜洿婊氬姩鏉￠珮搴�
+ console.log('containerTopToClientTopHeight', containerTopToClientTopHeight)
+ // const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0, -2) // 琛ㄦ牸琛ㄥご楂樺害
+ const tableHeadHeight = document.querySelector('.ant-table-thead th').offsetHeight // 琛ㄦ牸琛ㄥご楂樺害
+ console.log('tableHeadHeight', tableHeadHeight)
+ // this.scrollY = clientHeight - containerTopToClientTopHeight - tableHeadHeight
+ const tableSuitableScrollY = clientHeight - containerTopToClientTopHeight - tableHeadHeight // 琛ㄦ牸鍨傜洿婊氬姩鏉″悎閫傞珮搴︼紙琛ㄦ牸姘村钩婊氬姩鏉″垰濂藉湪鍙鍖哄煙鏈�涓嬫柟锛�
+ // const tableSuitableScrollY = 600
+ console.log('tableSuitableScrollY', tableSuitableScrollY)
+ const tableContainerHeight = document.getElementById('EfficiencyShift').offsetHeight
+ console.log('tableContainerHeight', tableContainerHeight)
+ const tableMaxScrollY = tableContainerHeight - tableHeadHeight // 琛ㄦ牸鍨傜洿婊氬姩鏉℃渶澶ч珮搴︼紙鑻ヨ秴鍑哄垯姘村钩婊氬姩鏉¤閬尅锛�
+ console.log('tableMaxScrollY', tableMaxScrollY)
+ if (tableSuitableScrollY && tableSuitableScrollY < tableMaxScrollY) this.scrollY = tableSuitableScrollY
+ else this.scrollY = tableMaxScrollY
+ console.log('scrollY', this.scrollY)
}
}
}
</script>
-<style scoped>
+<style scoped lang="less">
.pagination {
display: flex;
justify-content: end;
@@ -595,4 +628,10 @@
}
}
+ /deep/ .ant-table-body {
+ &::-webkit-scrollbar {
+ height: 12px;
+ }
+ }
+
</style>
\ No newline at end of file
--
Gitblit v1.9.3