From 017886be8a6c07ccaaf6300b8c7652ddbd41d734 Mon Sep 17 00:00:00 2001 From: qushaowei <qushaowei@163.com> Date: 星期一, 15 一月 2024 16:50:08 +0800 Subject: [PATCH] Merge branch 'master' of http://117.34.109.166:18448/r/vue_mdc_430 into develop --- src/views/mdc/base/modules/UnplannedDowntimemManager/UnplannedDowntimemManagerList.vue | 45 src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue | 139 -- src/views/mdc/base/MdcplancloseList.vue | 16 src/views/mdc/base/modules/efficiencyReport/EfficiencyList.vue | 136 +-- src/views/mdc/base/mdcPassRate.vue | 4 src/views/mdc/base/DeviceParamThresholdManagement.vue | 14 src/views/mdc/base/OvertimeManagement.vue | 4 src/views/mdc/base/alarmAnalysis.vue | 4 src/views/mdc/base/modules/deviceBaseInfo/EquipmentList.vue | 35 src/views/mdc/base/openRateFractionAnalysis.vue | 4 src/views/mdc/base/MdcDriveTypeParamConfigList.vue | 27 src/views/mdc/base/modules/efficiencyShiftReport/EfficiencyShiftList.vue | 80 - src/views/mdc/base/mdcStandardProcessDuration.vue | 4 src/views/mdc/base/modules/mdcProcessQuantity/mdcProcessQuantityList.vue | 58 + src/views/mdc/base/modules/deviceRepair/DeviceRepairList.vue | 58 + src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue | 130 -- src/views/mdc/base/openRateTrendAnalysis.vue | 4 src/views/mdc/base/EquipmentList.vue | 64 src/views/mdc/base/modules/deviceCalendar/DeviceCalendarList.vue | 131 +-- src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue | 114 +- src/views/mdc/base/modules/DeviceProcessReport/DeviceProcessReportList.vue | 144 +-- src/views/mdc/base/AlarmManager.vue | 14 src/views/mdc/base/modules/TorqueconfigurationList/TorqueconfigurationList.vue | 60 + src/views/mdc/base/Torqueconfiguration.vue | 4 src/views/mdc/base/modules/OvertimeManagement/OvertimeManagementList.vue | 55 + src/views/mdc/base/DeviceCalendar.vue | 4 src/views/mdc/base/modules/mdcPassRate/mdcPassRateList.vue | 57 + src/views/mdc/base/modules/shift/ShiftInfo.vue | 17 src/views/mdc/base/UnplannedDowntimemManager.vue | 4 /dev/null | 5 src/views/mdc/base/mdcProcessQuantity.vue | 4 src/views/mdc/base/modules/mdcStandardProcessDuration/MdcStandardProcessDurationList.vue | 50 + src/views/WorkshopSignage.vue | 42 src/views/mdc/common/BaseTree.vue | 108 +- src/views/mdc/base/HolidayManagement.vue | 4 src/views/mdc/base/modules/OEEAnalysis/OEEAnalysisList.vue | 242 ++--- src/views/mdc/base/modules/HolidayManagement/HolidayManagementList.vue | 50 src/views/mdc/base/modules/deviceBaseInfo/EquipmentLayout.vue | 35 src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue | 271 ------ src/views/mdc/base/modules/shift/ShiftSystem.vue | 17 src/views/mdc/base/MdcEquipmentTypeList.vue | 15 41 files changed, 986 insertions(+), 1,287 deletions(-) diff --git a/.env.test b/.env.test deleted file mode 100644 index 4a058db..0000000 --- a/.env.test +++ /dev/null @@ -1,5 +0,0 @@ -NODE_ENV=test -#VUE_APP_API_BASE_URL=http://127.0.0.1:8080 -VUE_APP_API_BASE_URL=http://192.168.0.173:8091 -VUE_APP_CAS_BASE_URL=http://cas.example.org:8443/cas -VUE_APP_ONLINE_BASE_URL=http://fileview.jeecg.com/onlinePreview \ No newline at end of file diff --git a/src/views/WorkshopSignage.vue b/src/views/WorkshopSignage.vue index 53d8115..0d993f3 100644 --- a/src/views/WorkshopSignage.vue +++ b/src/views/WorkshopSignage.vue @@ -2,7 +2,7 @@ <dv-full-screen-container class="full-screen-container"> <header class="page-header" :style="{height: pageHeaderHeight+'px'}"> {{ workshopDetails.workshopName }} - <div class="header-left" v-has="'home:saveDevicePositionAndSize'"> + <div class="header-left" v-has="'home:saveDevicePositionAndSize'" v-if="!isFullScreen"> <a-space> <span v-if="!isSwitchChecked">寮�鍚姛鑳�</span> <span v-else>鍏抽棴鍔熻兘</span> @@ -36,7 +36,7 @@ :y="item.coordinateTop" v-on:resizing="resize($event, index)" v-on:dragging="resize($event, index)" - :parentLimitation="true" + :parentLimitation="parentLimitation" :minw="70" :minh="70" :isDraggable="isDraggable" @@ -103,10 +103,6 @@ data() { return { pageHeaderHeight: 80,// 椤靛ご楂樺害 - taskBarHeight: window.screen.height - window.screen.availHeight,// 灞忓箷搴曢儴浠诲姟鏍忛珮搴� - utilsBarHeight: window.outerHeight - window.innerHeight,// 娴忚鍣ㄥ伐鍏锋爮楂樺害 - normalPageHeight: 0, - fullScreenPageHeight: 0, workshopDetails: {}, // 杞﹂棿璇︾粏淇℃伅, isDraggable: false, // 鏄惁寮�鍚嫋鎷� isResizable: false, // 鏄惁寮�鍚缉鏀� @@ -145,7 +141,10 @@ value: 22, color: '#FF0000' } - ]// 璁惧鐘舵�佹寚绀虹伅鍒楄〃锛� + ],// 璁惧鐘舵�佹寚绀虹伅鍒楄〃锛� + windowHeight: null,// 褰撳墠娴忚鍣ㄥ彲瑙嗗尯鍩熼珮搴︼紙锛堜笉鍖呮嫭宸ュ叿鏍忋�佷功绛俱�佸簳閮ㄤ换鍔℃爮锛夛紝杩涘叆椤甸潰鏃惰绠椾竴娆★紝闄ら潪閲嶆柊鍔犺浇椤甸潰鍚﹀垯娴忚鍣ㄥ彲瑙嗗尯鍩熼珮搴﹀垯涓嶅彂鐢熸敼鍙� + isFullScreen: false,// 杩涘叆鐪嬫澘椤甸潰鏃舵槸鍚︿负鍏ㄥ睆妯″紡锛屼笉鍖呮嫭姝e父妯″紡杩涘叆鍚庡垏鎹负鍏ㄥ睆妯″紡 + parentLimitation: false// 鎷栨嫿鍖哄煙鏄惁闄愬埗鍦ㄧ埗鍏冪礌鍖哄煙鍐� } }, watch: { @@ -189,7 +188,9 @@ this.$refs.deviceContainerRef.style.backgroundImage = `url(${this.getImgView( this.workshopDetails.backgroundImage )})` - this.$refs.deviceContainerRef.style.height = this.normalPageHeight + + this.$refs.deviceContainerRef.style.height = (this.windowHeight - this.pageHeaderHeight) + 'px' + this.parentLimitation = true // 鍦ㄧ埗鍏冪礌楂樺害璁剧疆鍚庡啀璁剧疆闄愬埗鎷栨嫿鍖哄煙锛屼笉杩欐牱鏈夋鐜囧鑷寸埗鍏冪礌楂樺害鏈缃氨闄愬埗鎷栨嫿 }) }, @@ -288,11 +289,16 @@ // setTimeout( this.$refs.equmentDetaiModel.initData(item.equipmentId),0) // },1000*10) } + }, + + /** + * 娴忚鍣ㄥ昂瀵稿彂鐢熸敼鍙樻椂瑙﹀彂 + */ + handleWindowSizeChange() { + if (this.isFullScreen) location.reload() // 濡傛灉椤甸潰杩涘叆鏃朵负鍏ㄥ睆妯″紡锛屽垯鍦ㄥ垏鎹㈡ā寮忔椂閲嶆柊鍔犺浇椤甸潰浠ラ噸鏂拌幏鍙栨祻瑙堝櫒鍙鍖哄煙楂樺害 } }, created() { - if (this.utilsBarHeight > 0) this.normalPageHeight = `calc(100% - ${this.pageHeaderHeight}px - ${this.taskBarHeight}px - ${this.utilsBarHeight}px)` - else this.normalPageHeight = `calc(100% - ${this.pageHeaderHeight}px - ${this.taskBarHeight}px - 87px)` if (this.$route.params.id) { this.getDeviceListByApi(this.$route.params.id) this.getWorkshopDetailsByApi(this.$route.params.id) @@ -301,6 +307,16 @@ mounted() { // 绂佹鐢ㄦ埛閫変腑鍐呭 document.onselectstart = () => false + + this.windowHeight = + window.innerHeight || + document.documentElement.clientHeight || + document.body.clientHeight + + // 鍒ゆ柇娴忚鍣ㄥ彲瑙嗗尯鍩熼珮搴︽槸鍚︾瓑浜庡垎杈ㄧ巼锛岃嫢鐩哥瓑鍒欒〃绀鸿繘鍏ユ椂娴忚鍣ㄤ负鍏ㄥ睆妯″紡 + if (this.windowHeight === screen.height) this.isFullScreen = true + + window.addEventListener('resize', this.handleWindowSizeChange) }, beforeDestroy() { // 纭繚閿�姣佸畾鏃跺櫒銆佷簨浠跺強鍥炴敹璧勬簮 @@ -324,7 +340,7 @@ .header-left { width: 450px; position: absolute; - left: 0px; + left: 0; top: 35px; display: flex; justify-content: space-evenly; @@ -383,7 +399,9 @@ width: 100%; height: 100%; display: flex; - align-items: end; + -webkit-align-items: flex-end; + -moz-align-items: flex-end; + -ms-align-items: flex-end; .status-image { background-size: 100% 100%; diff --git a/src/views/mdc/base/AlarmManager.vue b/src/views/mdc/base/AlarmManager.vue index 83c5383..acd894f 100644 --- a/src/views/mdc/base/AlarmManager.vue +++ b/src/views/mdc/base/AlarmManager.vue @@ -171,7 +171,7 @@ <a-table ref="table" size="middle" - :scroll="{x:true}" + :scroll="{x:'max-content',y:465}" bordered rowKey="id" :columns="columns" @@ -258,20 +258,23 @@ title: '鎶ヨ鍙�', align: "center", // sorter: true, - dataIndex: 'alarmCode' + dataIndex: 'alarmCode', + width:400 }, { title: '鎶ヨ鍐呭', align: "center", // sorter: true, - dataIndex: 'alarmContent' + dataIndex: 'alarmContent', + width:400 }, { title: '璁惧椹卞姩绫诲瀷', align: "center", // sorter: true, - dataIndex: 'driveType' + dataIndex: 'driveType', + width:400 }, // { // title: '鏄惁杩囨护', @@ -283,6 +286,7 @@ dataIndex:'isUse_dictText', title: '鏄惁杩囨护', align: "center", + width:380 // dictCode:'alarm_is_use' }, { @@ -290,7 +294,7 @@ dataIndex: 'action', align: "center", fixed: "right", - width: 147, + width: 150, scopedSlots: { customRender: 'action' } } ], diff --git a/src/views/mdc/base/DeviceCalendar.vue b/src/views/mdc/base/DeviceCalendar.vue index 1cbbdb8..705dc5d 100644 --- a/src/views/mdc/base/DeviceCalendar.vue +++ b/src/views/mdc/base/DeviceCalendar.vue @@ -2,7 +2,7 @@ <div style="width: 100%; height: 100%;"> <a-card :bordered="false"> <a-row type="flex" :gutter="16"> - <a-col :md="4"> + <a-col :md="5"> <a-tabs :activeKey="activeKey" @change="tabChange"> <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> <base-tree @getCurrSelected="changeSelectionNode"></base-tree> @@ -12,7 +12,7 @@ </a-tab-pane> </a-tabs> </a-col> - <a-col :md="20"> + <a-col :md="19"> <device-calendar-list ref="deviceList" :node='selectEquement' :Type="slectTypeTree"/> </a-col> </a-row> diff --git a/src/views/mdc/base/DeviceParamThresholdManagement.vue b/src/views/mdc/base/DeviceParamThresholdManagement.vue index a0da603..e2a170a 100644 --- a/src/views/mdc/base/DeviceParamThresholdManagement.vue +++ b/src/views/mdc/base/DeviceParamThresholdManagement.vue @@ -67,6 +67,7 @@ bordered size="middle" rowKey="id" + :scroll="{x:'max-content',y:600}" :columns="columns" :dataSource="dataSource" :pagination="ipagination" @@ -131,32 +132,32 @@ title: '涓枃鍚�', align: 'center', dataIndex: 'chineseName', - width: 120 + width: 350 // sorter: true }, { title: '鑻辨枃鍚�', align: 'center', - width: 150, + width: 350, dataIndex: 'englishName' }, { title: '椹卞姩绫诲瀷', align: 'center', - width: 180, + width: 350, dataIndex: 'controlSystemType' }, { title: '闃堝�间笂闄�', align: 'center', - width: 120, + width: 270, dataIndex: 'maxThreshold' // scopedSlots: {customRender: "avatarslot"} }, { title: '闃堝�间笅闄�', align: 'center', - width: 80, + width: 270, dataIndex: 'minThreshold' // sorter: true }, @@ -165,7 +166,8 @@ dataIndex: 'action', scopedSlots: { customRender: 'action' }, align: 'center', - width: 120 + fixed: 'right', + width: 150 } ], driveTypeList: [], diff --git a/src/views/mdc/base/EquipmentList.vue b/src/views/mdc/base/EquipmentList.vue index 55ce880..c2b147a 100644 --- a/src/views/mdc/base/EquipmentList.vue +++ b/src/views/mdc/base/EquipmentList.vue @@ -64,6 +64,7 @@ bordered size="middle" rowKey="id" + :scroll="{x:'max-content',y:465}" :columns="columns" :dataSource="dataSource" :pagination="ipagination" @@ -180,25 +181,25 @@ title: '璁惧缂栧彿', align: "center", dataIndex: 'equipmentId', - width: 120, + width: 200, // sorter: true }, { title: '璁惧鍚嶇О', align: "center", - width: 150, + width: 200, dataIndex: 'equipmentName', }, { title: '杞﹂棿', align: "center", - width: 180, + width: 200, dataIndex: 'productionName' }, { title: '璁惧绫诲瀷', align: "center", - width: 120, + width: 200, dataIndex: 'equipmentType', // scopedSlots: {customRender: "avatarslot"} }, @@ -206,33 +207,33 @@ { title: '椹卞姩绫诲瀷', align: "center", - width: 80, + width: 200, dataIndex: 'driveType', // sorter: true }, { title: '鏈哄簥IP', align: "center", - width: 100, + width: 200, dataIndex: 'equipmentIp' }, { title: '璁惧鍔熺巼', align: "center", - width: 100, + width: 200, dataIndex: 'devicePower' }, { title: '閮ㄩ棬', align: "center", - width: 180, + width: 200, dataIndex: 'orgCodeTxt' }, { title: '绯荤粺鐗堟湰', align: "center", - width: 80, + width: 200, dataIndex: 'systemVersion' }, { @@ -240,7 +241,8 @@ dataIndex: 'action', scopedSlots: {customRender: 'action'}, align: "center", - width: 120 + width: 150, + fixed:'right' } ], @@ -290,25 +292,25 @@ title: '璁惧缂栧彿', align: "center", dataIndex: 'equipmentId', - width: 120, + width: 200, // sorter: true }, { title: '璁惧鍚嶇О', align: "center", - width: 150, + width: 200, dataIndex: 'equipmentName', }, { title: '杞﹂棿', align: "center", - width: 180, + width: 200, dataIndex: 'productionName' }, { title: '璁惧绫诲瀷', align: "center", - width: 120, + width: 200, dataIndex: 'equipmentType', // scopedSlots: {customRender: "avatarslot"} }, @@ -316,33 +318,33 @@ { title: '椹卞姩绫诲瀷', align: "center", - width: 80, + width: 200, dataIndex: 'driveType', // sorter: true }, { title: '鏈哄簥IP', align: "center", - width: 100, + width: 200, dataIndex: 'equipmentIp' }, { title: '璁惧鍔熺巼', align: "center", - width: 100, + width: 200, dataIndex: 'devicePower' }, // { // title: '閮ㄩ棬', // align: "center", - // width: 180, + // width: 200, // dataIndex: 'orgCodeTxt' // }, { title: '绯荤粺鐗堟湰', align: "center", - width: 80, + width: 200, dataIndex: 'systemVersion' }, { @@ -350,7 +352,8 @@ dataIndex: 'action', scopedSlots: {customRender: 'action'}, align: "center", - width: 120 + width: 150, + fixed:'right' } ] @@ -370,25 +373,25 @@ title: '璁惧缂栧彿', align: "center", dataIndex: 'equipmentId', - width: 120, + width: 200, // sorter: true }, { title: '璁惧鍚嶇О', align: "center", - width: 150, + width: 200, dataIndex: 'equipmentName', }, { title: '杞﹂棿', align: "center", - width: 180, + width: 200, dataIndex: 'productionName' }, { title: '璁惧绫诲瀷', align: "center", - width: 120, + width: 200, dataIndex: 'equipmentType', // scopedSlots: {customRender: "avatarslot"} }, @@ -396,33 +399,33 @@ { title: '椹卞姩绫诲瀷', align: "center", - width: 80, + width: 200, dataIndex: 'driveType', // sorter: true }, { title: '鏈哄簥IP', align: "center", - width: 100, + width: 200, dataIndex: 'equipmentIp' }, { title: '璁惧鍔熺巼', align: "center", - width: 100, + width: 200, dataIndex: 'devicePower' }, { title: '閮ㄩ棬', align: "center", - width: 180, + width: 200, dataIndex: 'orgCodeTxt' }, { title: '绯荤粺鐗堟湰', align: "center", - width: 80, + width: 200, dataIndex: 'systemVersion' }, { @@ -430,7 +433,8 @@ dataIndex: 'action', scopedSlots: {customRender: 'action'}, align: "center", - width: 120 + width: 150, + fixed:'right' } ] diff --git a/src/views/mdc/base/HolidayManagement.vue b/src/views/mdc/base/HolidayManagement.vue index e230736..f996a39 100644 --- a/src/views/mdc/base/HolidayManagement.vue +++ b/src/views/mdc/base/HolidayManagement.vue @@ -2,7 +2,7 @@ <div style="width: 100%; height: 100%;"> <a-card :bordered="false"> <a-row type="flex" :gutter="16"> - <a-col :md="4"> + <a-col :md="5"> <a-tabs :activeKey="activeKey" @change="tabChange"> <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> <base-tree @getCurrSelected="changeSelectionNode"></base-tree> @@ -12,7 +12,7 @@ </a-tab-pane> </a-tabs> </a-col> - <a-col :md="20"> + <a-col :md="19"> <holiday-management-list ref="HolidayManagementList" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></holiday-management-list> </a-col> </a-row> diff --git a/src/views/mdc/base/MdcDriveTypeParamConfigList.vue b/src/views/mdc/base/MdcDriveTypeParamConfigList.vue index 0af6e3b..1647dd9 100644 --- a/src/views/mdc/base/MdcDriveTypeParamConfigList.vue +++ b/src/views/mdc/base/MdcDriveTypeParamConfigList.vue @@ -187,7 +187,7 @@ <a-table ref="table" size="middle" - :scroll="{x:true}" + :scroll="{x:'max-content',y:465}" bordered rowKey="id" :columns="columns" @@ -195,7 +195,6 @@ :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" - class="j-table-force-nowrap" @change="handleTableChange" > @@ -313,44 +312,50 @@ title: '鎺у埗绯荤粺绫诲瀷', align: "center", // sorter: true, - dataIndex: 'controlSystemType' + dataIndex: 'controlSystemType', + width: 300, }, { title: '涓枃鍚嶇О', align: "center", // sorter: true, - dataIndex: 'chineseName' + dataIndex: 'chineseName', + width: 300, }, { title: '鑻辨枃鍚嶇О', align: "center", // sorter: true, - dataIndex: 'englishName' + dataIndex: 'englishName', + width: 300, }, { title: '搴忓彿', align: "center", // sorter: true, - dataIndex: 'sortNo' + dataIndex: 'sortNo', + width:100 }, { title: '鏄剧ず鏍囧織', align: "center", dataIndex: 'showFlag', customRender: (text) => (text ? filterMultiDictText(this.dictOptions['showFlag'], text) : ''), + width: 300, }, { title:'宸ヤ綔鏇茬嚎鏍囧織', - align: "center", - dataIndex: 'curveGenerationFlags', - customRender: (text) => (text ? filterMultiDictText(this.dictOptions['curveGenerationFlags'], text) : ''), + align: "center", + dataIndex: 'curveGenerationFlags', + customRender: (text) => (text ? filterMultiDictText(this.dictOptions['curveGenerationFlags'], text) : ''), + width: 300, }, { title: '鎿嶄綔', dataIndex: 'action', align: "center", - fixed: "right", - width: 147, + width: 150, + fixed:'right', scopedSlots: { customRender: 'action' } } ], diff --git a/src/views/mdc/base/MdcEquipmentTypeList.vue b/src/views/mdc/base/MdcEquipmentTypeList.vue index b83a7e8..27bdd0e 100644 --- a/src/views/mdc/base/MdcEquipmentTypeList.vue +++ b/src/views/mdc/base/MdcEquipmentTypeList.vue @@ -59,7 +59,9 @@ :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" class="j-table-force-nowrap" - @change="handleTableChange"> + @change="handleTableChange" + :scroll="{x:'max-content',y:465}" + > <template slot="htmlSlot" slot-scope="text"> <div v-html="text"></div> @@ -139,25 +141,30 @@ { title:'璁惧绫诲瀷鍚嶇О', align:"center", - dataIndex: 'equipmentTypeName' + dataIndex: 'equipmentTypeName', + width:530 }, { title:'璁惧绫诲瀷鍥剧墖', align:"center", dataIndex: 'equipmentTypePictures', - scopedSlots: {customRender: 'imgSlot'} + scopedSlots: {customRender: 'imgSlot'}, + width:530 }, { title:'璁惧绫诲瀷鐘舵��', align:"center", dataIndex: 'equipmentTypeStates', customRender: (text) => (text ? filterMultiDictText(this.dictOptions['equipmentTypeStates'], text) : ''), + width:530 }, { title: '鎿嶄綔', dataIndex: 'action', align:"center", - scopedSlots: { customRender: 'action' } + scopedSlots: { customRender: 'action' }, + width:150, + fixed:'right' } ], url: { diff --git a/src/views/mdc/base/MdcplancloseList.vue b/src/views/mdc/base/MdcplancloseList.vue index bfd66cc..a90b63a 100644 --- a/src/views/mdc/base/MdcplancloseList.vue +++ b/src/views/mdc/base/MdcplancloseList.vue @@ -58,7 +58,7 @@ <a-table ref="table" size="middle" - :scroll="{x:true}" + :scroll="{x:'max-content',y:465}" bordered rowKey="id" :columns="columns" @@ -126,29 +126,33 @@ { title:'绫诲瀷', align:"center", - dataIndex: 'planCloseType' + dataIndex: 'planCloseType', + width:500 }, { title:'鏃堕棿绫诲瀷', align:"center", - dataIndex: 'planCloseTimeType' + dataIndex: 'planCloseTimeType', + width:350 }, { title:'鏃堕暱锛堝垎閽燂級', align:"center", - dataIndex: 'planCloseTimeLong' + dataIndex: 'planCloseTimeLong', + width:350 }, { title:'澶囨敞', align:"center", - dataIndex: 'remark' + dataIndex: 'remark', + width:380 }, { title: '鎿嶄綔', dataIndex: 'action', align:"center", fixed:"right", - width:147, + width:150, scopedSlots: { customRender: 'action' } } ], diff --git a/src/views/mdc/base/OvertimeManagement.vue b/src/views/mdc/base/OvertimeManagement.vue index 3a116fc..db4dce5 100644 --- a/src/views/mdc/base/OvertimeManagement.vue +++ b/src/views/mdc/base/OvertimeManagement.vue @@ -2,7 +2,7 @@ <div style="width: 100%; height: 100%;"> <a-card :bordered="false"> <a-row type="flex" :gutter="16"> - <a-col :md="4"> + <a-col :md="5"> <a-tabs :activeKey="activeKey" @change="tabChange"> <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> <base-tree @getCurrSelected="changeSelectionNode"></base-tree> @@ -12,7 +12,7 @@ </a-tab-pane> </a-tabs> </a-col> - <a-col :md="20"> + <a-col :md="19"> <overtime-management-list ref="OvertimeManagementList" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></overtime-management-list> </a-col> </a-row> diff --git a/src/views/mdc/base/Torqueconfiguration.vue b/src/views/mdc/base/Torqueconfiguration.vue index 2aa13cc..be23e7e 100644 --- a/src/views/mdc/base/Torqueconfiguration.vue +++ b/src/views/mdc/base/Torqueconfiguration.vue @@ -2,7 +2,7 @@ <div style="width: 100%; height: 100%;"> <a-card :bordered="false"> <a-row type="flex" :gutter="16"> - <a-col :md="4"> + <a-col :md="5"> <a-tabs :activeKey="activeKey" @change="tabChange"> <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> <base-tree @getCurrSelected="changeSelectionNode"></base-tree> @@ -12,7 +12,7 @@ </a-tab-pane> </a-tabs> </a-col> - <a-col :md="20"> + <a-col :md="19"> <torqueconfiguration-list ref="TorqueconfigurationList" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></torqueconfiguration-list> </a-col> </a-row> diff --git a/src/views/mdc/base/UnplannedDowntimemManager.vue b/src/views/mdc/base/UnplannedDowntimemManager.vue index bfe20a2..53fe732 100644 --- a/src/views/mdc/base/UnplannedDowntimemManager.vue +++ b/src/views/mdc/base/UnplannedDowntimemManager.vue @@ -2,7 +2,7 @@ <div style="width: 100%; height: 100%;"> <a-card :bordered="false"> <a-row type="flex" :gutter="16"> - <a-col :md="4"> + <a-col :md="5"> <a-tabs :activeKey="activeKey" @change="tabChange"> <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> <base-tree @getCurrSelected="changeSelectionNode"></base-tree> @@ -12,7 +12,7 @@ </a-tab-pane> </a-tabs> </a-col> - <a-col :md="20"> + <a-col :md="19"> <plan-downtime-maintenance-list ref="PlanDowntimeMaintenanceList" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></plan-downtime-maintenance-list> </a-col> </a-row> diff --git a/src/views/mdc/base/alarmAnalysis.vue b/src/views/mdc/base/alarmAnalysis.vue index c25bc0c..ba83a02 100644 --- a/src/views/mdc/base/alarmAnalysis.vue +++ b/src/views/mdc/base/alarmAnalysis.vue @@ -2,7 +2,7 @@ <div style="width: 100%; height: 100%;"> <a-card :bordered="false"> <a-row type="flex" :gutter="16"> - <a-col :md="4"> + <a-col :md="5"> <a-tabs :activeKey="activeKey" @change="tabChange"> <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> <base-tree @getCurrSelected="changeSelectionNode"></base-tree> @@ -12,7 +12,7 @@ </a-tab-pane> </a-tabs> </a-col> - <a-col :md="20"> + <a-col :md="19"> <alarm-analysis-main ref="alarmAnalysisMain" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></alarm-analysis-main> </a-col> </a-row> diff --git a/src/views/mdc/base/mdcPassRate.vue b/src/views/mdc/base/mdcPassRate.vue index 8d7feb0..e74a0b2 100644 --- a/src/views/mdc/base/mdcPassRate.vue +++ b/src/views/mdc/base/mdcPassRate.vue @@ -2,7 +2,7 @@ <div style="width: 100%; height: 100%;"> <a-card :bordered="false"> <a-row type="flex" :gutter="16"> - <a-col :md="4"> + <a-col :md="5"> <a-tabs :activeKey="activeKey" @change="tabChange"> <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> <base-tree @getCurrSelected="changeSelectionNode"></base-tree> @@ -12,7 +12,7 @@ </a-tab-pane> </a-tabs> </a-col> - <a-col :md="20"> + <a-col :md="19"> <mdc-pass-rate-list ref="MdcStandardProcessDurationList" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></mdc-pass-rate-list> </a-col> </a-row> diff --git a/src/views/mdc/base/mdcProcessQuantity.vue b/src/views/mdc/base/mdcProcessQuantity.vue index 3dfdb35..87b1c99 100644 --- a/src/views/mdc/base/mdcProcessQuantity.vue +++ b/src/views/mdc/base/mdcProcessQuantity.vue @@ -2,7 +2,7 @@ <div style="width: 100%; height: 100%;"> <a-card :bordered="false"> <a-row type="flex" :gutter="16"> - <a-col :md="4"> + <a-col :md="5"> <a-tabs :activeKey="activeKey" @change="tabChange"> <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> <base-tree @getCurrSelected="changeSelectionNode"></base-tree> @@ -12,7 +12,7 @@ </a-tab-pane> </a-tabs> </a-col> - <a-col :md="20"> + <a-col :md="19"> <mdc-process-quantity-list ref="mdcProcessQuantityList" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></mdc-process-quantity-list> </a-col> </a-row> diff --git a/src/views/mdc/base/mdcStandardProcessDuration.vue b/src/views/mdc/base/mdcStandardProcessDuration.vue index 7dc4fc9..998ad66 100644 --- a/src/views/mdc/base/mdcStandardProcessDuration.vue +++ b/src/views/mdc/base/mdcStandardProcessDuration.vue @@ -2,7 +2,7 @@ <div style="width: 100%; height: 100%;"> <a-card :bordered="false"> <a-row type="flex" :gutter="16"> - <a-col :md="4"> + <a-col :md="5"> <a-tabs :activeKey="activeKey" @change="tabChange"> <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> <base-tree @getCurrSelected="changeSelectionNode"></base-tree> @@ -12,7 +12,7 @@ </a-tab-pane> </a-tabs> </a-col> - <a-col :md="20"> + <a-col :md="19"> <mdc-standard-process-duration-list ref="MdcStandardProcessDurationList" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></mdc-standard-process-duration-list> </a-col> </a-row> diff --git a/src/views/mdc/base/modules/DeviceProcessReport/DeviceProcessReportList.vue b/src/views/mdc/base/modules/DeviceProcessReport/DeviceProcessReportList.vue index a4b39d9..3f87906 100644 --- a/src/views/mdc/base/modules/DeviceProcessReport/DeviceProcessReportList.vue +++ b/src/views/mdc/base/modules/DeviceProcessReport/DeviceProcessReportList.vue @@ -1,6 +1,5 @@ <template> - <div style="width: 100%;"> - <div :bordered="false"> + <div class="device_list"> <!-- 鏌ヨ鍖哄煙 --> <div class="seach-content"> <div class="table-page-search-wrapper"> @@ -17,7 +16,7 @@ </a-form-item> </a-col> - <a-col :md="5" :sm="5" :xs="5"> + <a-col :md="7" :sm="7" :xs="7"> <a-form-item label="鏃堕棿"> <a-range-picker :placeholder="['寮�濮嬫椂闂�', '缁撴潫鏃堕棿']" @@ -41,12 +40,10 @@ </div> </div> - <div class="container" id="EfficiencyShift" style="margin-top: 20px;"> - <div class="table2"> - <a-table :columns="columns" :dataSource="dataSource.records" :pagination="false" bordered> - <span slot="duration" slot-scope="text">{{getFormattedTime(text)}}</span> - </a-table> - </div> + <div class="container" id="EfficiencyShift" style="flex:1;overflow: hidden"> + <a-table :columns="columns" rowKey="equipmentId" :dataSource="dataSource.records" :scroll="{x:'max-content',y:scrollY}" :pagination="false" bordered> + <span slot="duration" slot-scope="text">{{getFormattedTime(text)}}</span> + </a-table> </div> <div class="pagination"> <a-pagination @@ -61,7 +58,6 @@ @showSizeChange="handlePageSizeChange" /> </div> - </div> </div> </template> @@ -83,7 +79,7 @@ typeEquipment: 1, allowClear: true, allowClearSu: true, - dates: [moment(), moment()], + dates: [moment().subtract('days', 1), moment().subtract('days', 1)], identifying: [], queryParam: { pageSize: 20, @@ -151,7 +147,8 @@ } ], dataSource: [], - driveTypeList: [] + driveTypeList: [], + scrollY:465 } }, props: { nodeTree: '', Type: '', nodePeople: '' }, @@ -161,6 +158,13 @@ this.queryParam.typeTree = '1' this.loadData() this.getDriveTypeByApi() + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) }, watch: { Type(valmath) { @@ -328,112 +332,56 @@ return ( option.componentOptions.children[0].text.toUpperCase().indexOf(input.toUpperCase()) >= 0 ) + }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('EfficiencyShift')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight } } } </script> <style scoped> - .table2 { - width: 100%; - height: 100%; - overflow: auto; - } - .pagination { display: flex; justify-content: end; margin: 20px 0; } - @media screen and (min-width: 1920px) { - #EfficiencyShift { - height: 670px !important; - overflow: scroll; + .device_list{ + overflow: hidden; + display: flex; + flex-direction: column; + } + + @media screen and (min-width: 1920px){ + .device_list{ + height: 811px!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){ + .device_list{ + height: 811px!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){ + .device_list{ + height: 663px!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){ + .device_list{ + height: 564px!important; } } - - @media screen and (max-width: 1280px) { - #EfficiencyShift { - height: 414px !important; - overflow: scroll; + @media screen and (max-width: 1280px){ + .device_list{ + height: 564px!important; } - } - - .identifyingclass { - width: 55px; - height: 15px; - display: inline-block - } - - .dataContent { - white-space: nowrap; - /*margin: 0;*/ - /*border: none;*/ - 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 .fixed th { - width: 50px; - } - - .dataContent .thead th { - background-color: #fafafa; - text-align: center; - height: 30px; - 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;*/ } </style> \ No newline at end of file diff --git a/src/views/mdc/base/modules/HolidayManagement/HolidayManagementList.vue b/src/views/mdc/base/modules/HolidayManagement/HolidayManagementList.vue index e12a612..184f6bd 100644 --- a/src/views/mdc/base/modules/HolidayManagement/HolidayManagementList.vue +++ b/src/views/mdc/base/modules/HolidayManagement/HolidayManagementList.vue @@ -9,12 +9,12 @@ <a-range-picker @change="dateParamChange" v-model="dates" format="YYYY-MM-DD"/> </a-form-item> </a-col> - <a-col :md="4" :sm="4"> + <a-col :md="5" :sm="5"> <a-form-item label="璁惧缂栧彿"> <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" v-model="queryParams.equipmentId"></a-input> </a-form-item> </a-col> - <a-col :md="4" :sm="4" :xs="4"> + <a-col :md="5" :sm="5" :xs="5"> <a-form-item label="璁惧鍚嶇О"> <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" v-model="queryParams.equipmentName"></a-input> </a-form-item> @@ -58,9 +58,9 @@ </div> <!-- table鍖哄煙-begin --> - <div id="DeviceList"> + <div id="DeviceList" style="flex: 1;overflow: hidden"> <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" - :scroll="{x:1000}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" + :scroll="{x:'max-content',y:scrollY}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" @change="handleTableChange"> <span slot="action" slot-scope="text, record"> @@ -138,16 +138,19 @@ queryParamEquip:{}, queryParamPeople:{}, dataStartsoucre:[], + scrollY:465, columns: [ { title: '璁惧缂栧彿', align: 'center', - dataIndex: 'equipmentId' + dataIndex: 'equipmentId', + width:250 }, { title: '璁惧鍚嶇О', align: 'center', dataIndex: 'equipmentName', + width:250 // defaultSortOrder:'descend', // sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1} }, @@ -155,6 +158,7 @@ title: '鏃ユ湡', align: 'center', dataIndex: 'vacationDate', + width:250 // scopedSlots:{customRender:'startTime'}, // customRender:(text,row,index) => { // return moment(text).format("YYYY-MM-DD HH:mm:ss") @@ -163,19 +167,22 @@ { title: '绫诲瀷', align: 'center', - dataIndex: 'vacationType' + dataIndex: 'vacationType', + width:250 }, { title: '澶囨敞', align: 'center', - dataIndex: 'notes' + dataIndex: 'notes', + width:250 }, { title: '鎿嶄綔', dataIndex: 'action', scopedSlots: {customRender: 'action'}, align: "center", - width: 150 + width: 150, + fixed:'right' } ], url: { @@ -629,9 +636,25 @@ exclude_inputs: true }); }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight - 50 + } }, created() { this.queryParam.typeTree = "1" + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) } } </script> @@ -639,34 +662,35 @@ <style lang="less" scoped> @import '~@assets/less/common.less'; + .device_list{ + display: flex; + flex-direction: column; + overflow: hidden; + } + @media screen and (min-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .device_list{ height: 663px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .device_list{ height: 564px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .device_list{ height: 564px!important; - overflow: scroll; } } </style> diff --git a/src/views/mdc/base/modules/OEEAnalysis/OEEAnalysisList.vue b/src/views/mdc/base/modules/OEEAnalysis/OEEAnalysisList.vue index fd2560d..e9fec71 100644 --- a/src/views/mdc/base/modules/OEEAnalysis/OEEAnalysisList.vue +++ b/src/views/mdc/base/modules/OEEAnalysis/OEEAnalysisList.vue @@ -1,12 +1,21 @@ <template> - <div style="width: 100%;"> - <div :bordered="false"> + <div class="device_list"> <!-- 鏌ヨ鍖哄煙 --> <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="5" :sm="5" :xs="5"> + <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="7" :sm="7" :xs="7"> <a-form-item label="鏃堕棿"> <a-range-picker :placeholder="['寮�濮嬫椂闂�', '缁撴潫鏃堕棿']" @@ -17,28 +26,7 @@ /> </a-form-item> </a-col> - <!--<a-col :md="5" :sm="5" :xs="5">--> - <!--<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="5" :sm="5" :xs="5">--> - <!--<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="8" :sm="8" :xs="8"> + <a-col :md="2" :sm="2" :xs="2"> <a-space> <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> <a-button type="primary" @click="searchReset" icon="reload">閲嶇疆</a-button> @@ -51,27 +39,22 @@ </div> </div> - <div class="container" id="EfficiencyShift" style="margin-top: 20px;"> - <div class="table2"> - <a-table :columns="columns" :dataSource="dataSource.records" :pagination="false" bordered - :scroll="{ x: 3200, y: false }"> - </a-table> - </div> + <div id="EfficiencyShift" style="flex:1;overflow: hidden"> + <a-table :columns="columns" rowKey="equipmentId" :dataSource="dataSource.records" :pagination="false" :scroll="{x:'max-content',y:scrollY}" bordered></a-table> </div> - <div class="pagination"> - <a-pagination - :total=dataSource.total - :show-total="(total, range) => `${range[0]}-${range[1]} 鍏� ${total} 鏉" - :page-size="+queryParam.pageSize" - :default-current="1" - :current=+queryParam.pageNo - show-size-changer - :pageSizeOptions="['20','30','40','50']" - @change="handlePageNoChange" - @showSizeChange="handlePageSizeChange" - /> - </div> - </div> + <!--<div class="pagination">--> + <!--<a-pagination--> + <!--:total=dataSource.total--> + <!--:show-total="(total, range) => `${range[0]}-${range[1]} 鍏� ${total} 鏉"--> + <!--:page-size="+queryParam.pageSize"--> + <!--:default-current="1"--> + <!--:current=+queryParam.pageNo--> + <!--show-size-changer--> + <!--:pageSizeOptions="['20','30','40','50']"--> + <!--@change="handlePageNoChange"--> + <!--@showSizeChange="handlePageSizeChange"--> + <!--/>--> + <!--</div>--> </div> </template> @@ -81,21 +64,16 @@ import $ from 'jquery' import '@/components/table2excel/table2excel' import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api' + import api from '@api/mdc' export default { name: 'OEEAnalysisList', components: {}, data() { return { - typeTree: '', - typeParent: 1, - typeEquipment: 1, - allowClear: true, - allowClearSu: true, dates: [moment().subtract('month', 1), moment().subtract('month', 1)], - identifying: [], queryParam: { - pageSize: 20, + pageSize: 10000, pageNo: 1 }, queryParamEquip: {}, @@ -117,21 +95,18 @@ customRender: function(t, r, index) { return parseInt(index) + 1 } - // fixed: 'left' }, { title: '璁惧缁熶竴缂栧彿', align: 'center', dataIndex: 'equipmentId', width: 120 - // fixed: 'left' }, { title: '璁惧鍚嶇О', align: 'center', width: 200, dataIndex: 'equipmentName' - // fixed: 'left' }, { title: '璁惧鍨嬪彿', @@ -148,7 +123,7 @@ { title: '鐝', align: 'center', - width: 300, + width: 100, dataIndex: 'shift', ellipsis: true, }, @@ -250,7 +225,7 @@ dataIndex: 'timeActuationRate', align: 'center', width: 110, - customRender: text => text != 0 ? text * 100 + '%' : 0 + customRender: text => text != 0 ? parseFloat((text * 100).toFixed(2)) + '%' : 0 }, { title: '鍔犲伐闆朵欢鏁帮紙浠讹級', @@ -269,7 +244,7 @@ dataIndex: 'performanceRate', align: 'center', width: 110, - customRender: text => text != 0 ? text * 100 + '%' : 0 + customRender: text => text != 0 ? parseFloat((text * 100).toFixed(2)) + '%' : 0 }, { title: '搴熷搧鏁�', @@ -282,26 +257,35 @@ dataIndex: 'passRate', align: 'center', width: 100, - customRender: text => text != 0 ? text * 100 + '%' : 0 + customRender: text => text != 0 ? parseFloat((text * 100).toFixed(2)) + '%' : 0 }, { title: '璁惧缁煎悎鏁堢巼', dataIndex: 'overallEquipmentEfficiency', align: 'center', width: 120, - customRender: text => text != 0 ? text * 100 + '%' : 0 + customRender: text => text != 0 ? parseFloat((text * 100).toFixed(2)) + '%' : 0 } ], - dataSource: [] + dataSource: [], + driveTypeList: [], + scrollY:465, } }, props: { nodeTree: '', Type: '', nodePeople: '' }, created() { - this.initShiftList() this.queryParam.startTime = moment(this.dates[0]).format('YYYY-MM') this.queryParam.endTime = moment(this.dates[1]).format('YYYY-MM') this.queryParam.typeTree = '1' this.loadData() + this.getDriveTypeByApi() + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) }, watch: { Type(valmath) { @@ -418,6 +402,15 @@ this.loadData() }, + /** + * 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷 + */ + getDriveTypeByApi() { + api.getDriveTypeApi().then((res) => { + this.driveTypeList = res.result.map(item => item.value) + }) + }, + loadData() { getAction(this.url.list, this.queryParam).then(res => { if (res.success) { @@ -444,112 +437,67 @@ handlePageSizeChange(current, size) { this.queryParam.pageSize = size this.loadData() + }, + /** + * 鑱旀兂杈撳叆妗嗙瓫閫夊姛鑳� + * @param input 杈撳叆鐨勫唴瀹� + * @param option 閰嶇疆 + * @returns {boolean} 鍒ゆ柇鏄惁绛涢�� + */ + filterOption(input, option) { + return ( + option.componentOptions.children[0].text.toUpperCase().indexOf(input.toUpperCase()) >= 0 + ) + }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('EfficiencyShift')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight } } } </script> <style scoped> - .table2 { - width: 100%; - height: 100%; - overflow: auto; - } - .pagination { display: flex; justify-content: end; margin: 20px 0; } - @media screen and (min-width: 1920px) { - #EfficiencyShift { - height: 670px !important; - overflow: scroll; + .device_list{ + overflow: hidden; + display: flex; + flex-direction: column; + } + + @media screen and (min-width: 1920px){ + .device_list{ + height: 811px!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){ + .device_list{ + height: 811px!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){ + .device_list{ + height: 663px!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){ + .device_list{ + height: 564px!important; } } - - @media screen and (max-width: 1280px) { - #EfficiencyShift { - height: 414px !important; - overflow: scroll; + @media screen and (max-width: 1280px){ + .device_list{ + height: 564px!important; } - } - - .identifyingclass { - width: 55px; - height: 15px; - display: inline-block - } - - .dataContent { - white-space: nowrap; - /*margin: 0;*/ - /*border: none;*/ - 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 .fixed th { - width: 50px; - } - - .dataContent .thead th { - background-color: #fafafa; - text-align: center; - height: 30px; - 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;*/ } </style> \ No newline at end of file diff --git a/src/views/mdc/base/modules/OvertimeManagement/OvertimeManagementList.vue b/src/views/mdc/base/modules/OvertimeManagement/OvertimeManagementList.vue index 6f55e67..f8ee888 100644 --- a/src/views/mdc/base/modules/OvertimeManagement/OvertimeManagementList.vue +++ b/src/views/mdc/base/modules/OvertimeManagement/OvertimeManagementList.vue @@ -9,7 +9,7 @@ <a-range-picker @change="dateParamChange" v-model="dates" format="YYYY-MM-DD HH:mm:ss"/> </a-form-item> </a-col> - <a-col :md="4" :sm="4"> + <a-col :md="5" :sm="5"> <a-form-item label="璁惧缂栧彿"> <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" v-model="queryParams.equipmentId"></a-input> </a-form-item> @@ -60,9 +60,9 @@ </div> <!-- table鍖哄煙-begin --> - <div id="DeviceList"> + <div id="DeviceList" style="flex: 1;overflow: hidden"> <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" - :scroll="{x:1000}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" + :scroll="{x:'max-content',y:scrollY}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" @change="handleTableChange"> <span slot="action" slot-scope="text, record"> @@ -144,16 +144,19 @@ queryParamEquip:{}, queryParamPeople:{}, dataStartsoucre:[], + scrollY:465, columns: [ { title: '璁惧缂栧彿', align: 'center', - dataIndex: 'equipmentId' + dataIndex: 'equipmentId', + width:150 }, { title: '璁惧鍚嶇О', align: 'center', dataIndex: 'equipmentName', + width:200 // defaultSortOrder:'descend', // sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1} }, @@ -161,6 +164,7 @@ title: '鏃ユ湡', align: 'center', dataIndex: 'effectiveDate', + width:150 // scopedSlots:{customRender:'startTime'}, // customRender:(text,row,index) => { // return moment(text).format("YYYY-MM-DD HH:mm:ss") @@ -169,33 +173,39 @@ { title: '鐝寮�濮嬫椂闂�', align: 'center', - dataIndex: 'startDate' + dataIndex: 'startDate', + width:150 }, { title: '鐝缁撴潫鏃堕棿', align: 'center', - dataIndex: 'endDate' + dataIndex: 'endDate', + width:150 }, { title: '鍔犵彮寮�濮嬫椂闂�', align: 'center', - dataIndex: 'startTime' + dataIndex: 'startTime', + width:150 }, { title: '鍔犵彮缁撴潫鏃堕棿', align: 'center', - dataIndex: 'endTime' + dataIndex: 'endTime', + width:150 }, { title: '澶囨敞', align: 'center', - dataIndex: 'remark' + dataIndex: 'remark', + width:150 }, { title: '鎿嶄綔', dataIndex: 'action', scopedSlots: {customRender: 'action'}, align: "center", + fixed:'right', width: 150 } ], @@ -686,9 +696,25 @@ exclude_inputs: true }); }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight - 50 + } }, created() { this.queryParam.typeTree = "1" + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) } } </script> @@ -696,34 +722,35 @@ <style lang="less" scoped> @import '~@assets/less/common.less'; + .device_list{ + overflow: hidden; + display: flex; + flex-direction: column; + } + @media screen and (min-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .device_list{ height: 663px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .device_list{ height: 564px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .device_list{ height: 564px!important; - overflow: scroll; } } </style> diff --git a/src/views/mdc/base/modules/TorqueconfigurationList/TorqueconfigurationList.vue b/src/views/mdc/base/modules/TorqueconfigurationList/TorqueconfigurationList.vue index b82d26a..eb0e098 100644 --- a/src/views/mdc/base/modules/TorqueconfigurationList/TorqueconfigurationList.vue +++ b/src/views/mdc/base/modules/TorqueconfigurationList/TorqueconfigurationList.vue @@ -1,20 +1,20 @@ <template> - <div :bordered="false" class="device_list"> + <div class="device_list"> <!-- 鏌ヨ鍖哄煙 --> - <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper"> + <div style=" background-color: #fff;overflow: auto" class="table-page-search-wrapper"> <a-form layout="inline" @keyup.enter.native="searchQuery"> - <a-row :gutter="24"> + <a-row :gutter="24" style="width: 100%;"> <a-col :md="7" :sm="7"> <a-form-item label="鏃堕棿"> <a-range-picker @change="dateParamChange" v-model="dates" format="YYYY-MM-DD HH:mm:ss"/> </a-form-item> </a-col> - <a-col :md="4" :sm="4"> + <a-col :md="5" :sm="5"> <a-form-item label="璁惧缂栧彿"> <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" v-model="queryParams.equipmentId"></a-input> </a-form-item> </a-col> - <a-col :md="4" :sm="4" :xs="4"> + <a-col :md="5" :sm="5" :xs="5"> <a-form-item label="璁惧鍚嶇О"> <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" v-model="queryParams.equipmentName"></a-input> </a-form-item> @@ -59,11 +59,11 @@ </div> <!-- table鍖哄煙-begin --> - <div id="DeviceList"> + <div id="DeviceList" style="flex: 1;overflow: hidden"> <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" - :scroll="{x:1000}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" + :dataSource="dataSource" :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" - @change="handleTableChange"> + @change="handleTableChange" :scroll="{x:'max-content',y:scrollY}"> <span slot="action" slot-scope="text, record"> <a @click="handleEdit(record)">缂栬緫</a> <a-divider type="vertical" /> @@ -116,12 +116,10 @@ import JEllipsis from '@/components/jeecg/JEllipsis' import Tooltip from 'ant-design-vue/es/tooltip' import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api' - import ACol from 'ant-design-vue/es/grid/Col' export default { name: 'TorqueconfigurationList', mixins: [JeecgListMixin], components: { - ACol, Tooltip, TorqueconfigurationModal, TorqueconfigurationModaledit, @@ -146,16 +144,19 @@ queryParamEquip:{}, queryParamPeople:{}, dataStartsoucre:[], + scrollY:465, columns: [ { title: '璁惧缂栧彿', align: 'center', - dataIndex: 'equipmentId' + dataIndex: 'equipmentId', + width:250 }, { title: '璁惧鍚嶇О', align: 'center', dataIndex: 'equipmentName', + width:250 // defaultSortOrder:'descend', // sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1} }, @@ -163,6 +164,7 @@ title: '鏃堕棿', align: 'center', dataIndex: 'torqueDate', + width:250 // scopedSlots:{customRender:'startTime'}, // customRender:(text,row,index) => { // return moment(text).format("YYYY-MM-DD HH:mm:ss") @@ -171,19 +173,22 @@ { title: '鎵煩鍊�', align: 'center', - dataIndex: 'torqueValue' + dataIndex: 'torqueValue', + width:150 }, { title: '澶囨敞', align: 'center', - dataIndex: 'notes' + dataIndex: 'notes', + width:350 }, { title: '鎿嶄綔', dataIndex: 'action', scopedSlots: {customRender: 'action'}, align: "center", - width: 150 + width: 150, + fixed:'right' } ], url: { @@ -669,6 +674,15 @@ exclude_inputs: true }); }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight - 50 + } // /** // * 杞﹂棿閫変腑椤瑰彇娑堝悗瑙﹀彂姝や簨浠讹紝鐢盉aseTree缁勪欢鐢变簨浠舵�荤嚎瑙﹀彂 // * @param value 鎻愮ず淇℃伅 @@ -682,6 +696,13 @@ created() { this.queryParam.typeTree = "1" // this.$bus.$on('treeClearSelected',this.treeClearSelected) + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) } } </script> @@ -689,34 +710,35 @@ <style lang="less" scoped> @import '~@assets/less/common.less'; + .device_list{ + overflow: hidden; + display: flex; + flex-direction: column; + } + @media screen and (min-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .device_list{ height: 663px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .device_list{ height: 564px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .device_list{ height: 564px!important; - overflow: scroll; } } </style> diff --git a/src/views/mdc/base/modules/UnplannedDowntimemManager/UnplannedDowntimemManagerList.vue b/src/views/mdc/base/modules/UnplannedDowntimemManager/UnplannedDowntimemManagerList.vue index 6f7e767..172ff2b 100644 --- a/src/views/mdc/base/modules/UnplannedDowntimemManager/UnplannedDowntimemManagerList.vue +++ b/src/views/mdc/base/modules/UnplannedDowntimemManager/UnplannedDowntimemManagerList.vue @@ -60,9 +60,9 @@ </div> <!-- table鍖哄煙-begin --> - <div id="DeviceList"> + <div id="DeviceList" style="overflow: hidden;flex: 1"> <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" - :scroll="{x:1000}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" + :scroll="{x:'max-content',y:scrollY}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" @change="handleTableChange"> <span slot="action" slot-scope="text, record"> @@ -140,6 +140,7 @@ queryParamEquip:{}, queryParamPeople:{}, dataStartsoucre:[], + scrollY:465, columns: [ { title: '#', @@ -154,12 +155,14 @@ { title: '璁惧缂栧彿', align: 'center', - dataIndex: 'equipmentId' + dataIndex: 'equipmentId', + width:200 }, { title: '璁惧鍚嶇О', align: 'center', dataIndex: 'equipmentName', + width:200 // defaultSortOrder:'descend', // sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1} }, @@ -167,6 +170,7 @@ title: '绫诲瀷', align: 'center', dataIndex: 'noplanType', + width:200 // defaultSortOrder:'descend', // sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1} }, @@ -174,6 +178,7 @@ title: '寮�濮嬫椂闂�', align: 'center', dataIndex: 'startTime', + width:200 // scopedSlots:{customRender:'startTime'}, // customRender:(text,row,index) => { // return moment(text).format("YYYY-MM-DD HH:mm:ss") @@ -182,18 +187,21 @@ { title: '缁撴潫鏃堕棿', align: 'center', - dataIndex: 'endTime' + dataIndex: 'endTime', + width:200 }, { title: '澶囨敞', align: 'center', - dataIndex: 'remark' + dataIndex: 'remark', + width:200 }, { title: '鎿嶄綔', dataIndex: 'action', scopedSlots: {customRender: 'action'}, align: "center", + fixed:'right', width: 150 } ], @@ -649,9 +657,25 @@ exclude_inputs: true }); }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight - 50 + } }, created() { this.queryParam.typeTree = "1" + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) } } </script> @@ -659,34 +683,35 @@ <style lang="less" scoped> @import '~@assets/less/common.less'; + .device_list{ + overflow: hidden; + display: flex; + flex-direction: column; + } + @media screen and (min-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .device_list{ height: 663px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .device_list{ height: 564px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .device_list{ height: 564px!important; - overflow: scroll; } } </style> diff --git a/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue b/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue index 7150831..12d210a 100644 --- a/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue +++ b/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue @@ -5,13 +5,13 @@ <div class="table-page-search-wrapper"> <a-form layout="inline" @keyup.enter.native="searchQuery"> <a-row :gutter="24"> - <a-col :md="6" :sm="6"> + <a-col :md="7" :sm="7"> <a-form-item label="鏃堕棿"> <a-range-picker @change="dateParamChange" :disabledDate="disabledDate" format="YYYYMMDD" v-model="dates"/> </a-form-item> </a-col> - <a-col :lg="2" :md="3" :sm="3" :xs="3"> + <a-col :lg="2" :md="2" :sm="2" :xs="2"> <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> </a-col> </a-row> @@ -19,44 +19,6 @@ </div> <div id="DeviceList"> <div class="openRateTrendDg"> - <!--<div id="Efficiency" class="container">--> - <!--<div class="table2">--> - <!--<table class="dataContent table" border="1" cellspacing="0" cellpadding="0"--> - <!--style="white-space: nowrap;text-align: left;">--> - <!--<thead>--> - <!--<tr class="thead fixed equipname">--> - <!--<th class="thgu dong1 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;">鎶ヨ鍙�--> - <!--</th>--> - <!--<th class="thgu dong2 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;">--> - <!--鍑虹幇娆℃暟--> - <!--</th>--> - <!--<th class="thgu dong3 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;">--> - <!--鍚堣鎸佺画鏃堕棿--> - <!--</th>--> - <!--<th class="thgu dong4 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>–>--> - <!--</tr>--> - <!--</thead>--> - <!--<tbody>--> - <!--<tr class="mathData" v-for="(item, index) in dataList" @click="TableDraw(index,item)">--> - <!--<td class="tdgu kaitou">{{item.alarmCode}}</td>--> - <!--<td class="tdgu1 kaitou">{{item.count}}</td>--> - <!--<td class="tdgu2 kaitou">{{getFormattedTime(item.timeCount)}}--> - <!--<!–<td class="tdgu2 kaitou">{{item.timeCount}}</td>–>--> - <!--<td class="tdgu3 kaitou">{{item.alarmContent}}</td>--> - <!--<!–<template v-for="(tableHead, index) in item.dataList">–>--> - <!--<!–<td :style="{background:tableHead.color }">{{tableHead.utilizationRate | numFilter}}</td>–>--> - <!--<!–</template>–>--> - <!--</tr>--> - <!--</tbody>--> - <!--</table>--> - <!--</div>--> - <!--</div>--> - <!--<a-spin :spinning=""></a-spin>--> <a-table :columns="columns" :data-source="dataList" bordered :pagination="false" :scroll="{y:210}" :customRow="customRow" rowKey="alarmCode" @expand="handleExpandChange" :loading="outerDataLoading" @@ -197,6 +159,10 @@ }, mounted() { this.drawWrin() + window.addEventListener('resize',this.handleWindowResize) + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) }, watch: { Type(valmath) { @@ -454,7 +420,7 @@ }) }, drawWrin() { - let equipmentWarningPie = this.$echarts.init(document.getElementById('MdcEquipmentWarningPie'), 'macarons') + this.equipmentWarningPie = this.$echarts.init(document.getElementById('MdcEquipmentWarningPie'), 'macarons') let equipmentWarningPieOption = { title: { text: '鍚勮澶囧嚭鐜版鎶ヨ鐨勬瘮渚�', @@ -493,8 +459,8 @@ // data:[{name:'jjjjjjj',value:'2'}] }] } - equipmentWarningPie.setOption(equipmentWarningPieOption, true) - let equipmentWarningLine = this.$echarts.init(document.getElementById('MdcEquipmentWarningLine'), 'macarons') + this.equipmentWarningPie.setOption(equipmentWarningPieOption, true) + this.equipmentWarningLine = this.$echarts.init(document.getElementById('MdcEquipmentWarningLine'), 'macarons') let equipmentWarningLineOption = { title: { text: '姣忓ぉ鍑虹幇姝ゆ姤璀︾殑鏁伴噺璧板娍', @@ -562,7 +528,7 @@ } ] } - equipmentWarningLine.setOption(equipmentWarningLineOption, true) + this.equipmentWarningLine.setOption(equipmentWarningLineOption, true) }, /** @@ -611,220 +577,19 @@ _this.innerDataLoading = false }) } + }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + if(this.equipmentWarningPie) this.equipmentWarningPie.resize() + if(this.equipmentWarningLine) this.equipmentWarningLine.resize() } } } </script> <style scoped> - .dataContent { - white-space: nowrap; - /*margin: 0;*/ - /*border: none;*/ - 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 .fixed th {*/ - /*width: 50px;*/ - /*}*/ - - .dataContent .thead th { - background-color: #fafafa; - text-align: center; - height: 30px; - padding: 5px; - } - - .dataContent .notfixed th { - /*width: auto;*/ - } - - .dataContent tr td { - height: 35px; - } - - .dataContent .mathData:hover td { - background-color: #e6f7ff; - } - - .dataContent .mathData td { - padding: 10px; - /*display: none;*/ - } - - .dataContent .mathData td { - /*background-color: #ff9bd2;*/ - cursor: pointer; - } - - .dataContent .mathData .tdd { - /*display: none;*/ - } - - .table2 { - width: 100%; - height: 100%; - overflow: auto; - } - - /*tr th {*/ - /*height: 50px!important;*/ - /*}*/ - /*tr td{*/ - /*height: 50px!important;*/ - /*}*/ - .table2 thead tr th:first-child, - .table tbody tr .tdgu { - position: sticky; - left: 0; - z-index: 1; - } - - .table tbody tr .kaitou { - z-index: 1; - background-color: white; - } - - .table tbody tr .tdgu1 { - position: sticky; - left: 150px; - z-index: 2; - } - - .table tbody tr .tdgu2 { - position: sticky; - left: 300px; - z-index: 2; - } - - .table tbody tr .tdgu3 { - position: sticky; - left: 450px; - z-index: 2; - } - - .table tbody tr .tdgu4 { - position: sticky; - left: 550px; - z-index: 2; - } - - .table tbody tr .tdgu5 { - position: sticky; - left: 700px; - 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: 6 !important; - } - - .table2 thead .equipname .name { - z-index: 3; - } - - .table2 thead .equipname .dong1 { - z-index: 4; - left: 0; - /*border: 1px solid #000;*/ - } - - .table2 thead .equipname .dong2 { - z-index: 5; - left: 150px; - } - - .table2 thead .equipname .dong3 { - z-index: 5; - left: 300px; - } - - .table2 thead .equipname .dong4 { - z-index: 5; - left: 450px; - } - - .table2 thead .equipname .dong5 { - z-index: 5; - left: 550px; - } - - .table2 thead .equipname .dong6 { - z-index: 5; - left: 700px; - } - - @media screen and (min-width: 1920px) { - #Efficiency { - height: 258px !important; - overflow: scroll; - } - } - - @media screen and (min-width: 1680px) and (max-width: 1920px) { - #Efficiency { - height: 258px !important; - overflow: scroll; - } - } - - @media screen and (min-width: 1400px) and (max-width: 1680px) { - #Efficiency { - height: 160px !important; - overflow: scroll; - } - } - - @media screen and (min-width: 1280px) and (max-width: 1400px) { - #Efficiency { - height: 60px !important; - overflow: scroll; - } - } - - @media screen and (max-width: 1280px) { - #Efficiency { - height: 90px !important; - overflow: scroll; - } - } - - #Efficiency .table_guding1 { - position: absolute; - overflow: hidden; - width: 500px; - } - - #Efficiency .table_guding2 { - overflow-x: scroll; - width: 500px; - } - - /deep/ .ant-card { - height: 100% !important; - } - - /deep/ .ant-card .ant-card-body { - height: 100% !important; - } - .efficiency_list #DeviceList { height: 90% !important; } diff --git a/src/views/mdc/base/modules/deviceBaseInfo/EquipmentLayout.vue b/src/views/mdc/base/modules/deviceBaseInfo/EquipmentLayout.vue index b7d8c93..71d216f 100644 --- a/src/views/mdc/base/modules/deviceBaseInfo/EquipmentLayout.vue +++ b/src/views/mdc/base/modules/deviceBaseInfo/EquipmentLayout.vue @@ -124,42 +124,38 @@ .equipment_box img{ width: 45%; } + + .containerequip{ + overflow: auto; + } + @media screen and (min-width: 1920px){ .containerequip{ height: 640px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .containerequip{ height: 640px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .containerequip{ height: 493px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .containerequip{ height: 493px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .containerequip{ height: 394px!important; - overflow: scroll; } } .container_content { width: 100%; - /*display: flex;*/ - /*flex-wrap: wrap;*/ - /*justify-content: space-between;*/ - /*align-items: center;*/ position: relative; } @@ -168,34 +164,13 @@ display: inline-block; text-align: center; margin-bottom: 5%; - /*float: left;*/ } .container_content .contnet p { padding-top: 5%; } - /*.container_content .contnet img {*/ - /*padding: 5%;*/ - /*}*/ - /**/ - .addclass { - /*float: left;*/ - /*position: absolute;*/ - /*top: 0;*/ - /*left: 0;*/ - } - - .noaddclass { - /*float: left;*/ - } - - /*.addclass .content_equipment img {*/ - /*border-bottom: 2px solid #e957ff;*/ - /*!*padding-bottom: 8%;*!*/ - /*}*/ .addclass p { border-bottom: 2px solid #e957ff; - /*padding-bottom: 8%;*/ } </style> \ No newline at end of file diff --git a/src/views/mdc/base/modules/deviceBaseInfo/EquipmentList.vue b/src/views/mdc/base/modules/deviceBaseInfo/EquipmentList.vue index 3f41c4e..fc8afcb 100644 --- a/src/views/mdc/base/modules/deviceBaseInfo/EquipmentList.vue +++ b/src/views/mdc/base/modules/deviceBaseInfo/EquipmentList.vue @@ -1,5 +1,5 @@ <template> - <a-card :bordered="false"> + <a-card :bordered="false" style="display: flex;flex-direction: column"> <!-- 鏌ヨ鍖哄煙 --> <!--<div class="table-page-search-wrapper">--> @@ -48,7 +48,7 @@ <!--<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">閲嶇疆</a-button>--> <!--</div>--> - <div class="equipmentList"> + <div class="equipmentList" id="DeviceList"> <!--<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">--> <!--<i class="anticon anticon-info-circle ant-alert-icon"></i>宸查�夋嫨 <a style="font-weight: 600">{{--> <!--selectedRowKeys.length }}</a>椤� --> @@ -56,8 +56,7 @@ <!--</div>--> <a-table ref="table" bordered size="middle" rowKey="equipmentId" :columns="columns" :dataSource="dataSource" - :pagination="false" :loading="loading" - style="height: 100%; overflow-y: scroll;"> + :pagination="false" :loading="loading" :scroll="{x:'max-content',y:scrollY}"> </a-table> </div> </a-card> @@ -79,25 +78,30 @@ title: '璁惧ID', align: "center", dataIndex: 'equipmentId', + width:250 }, { title: '璁惧鍚嶇О', align: "center", dataIndex: 'equipmentName', + width:300 }, { title: '鐘舵��', align: "center", dataIndex: 'oporationDict', + width:150 }, { title: '閲囬泦鏃堕棿', align: "center", dataIndex: 'collecttime', defaultSortOrder:'descend', - sorter: (a, b) => {return a.collecttime>b.collecttime?1:-1} + sorter: (a, b) => {return a.collecttime>b.collecttime?1:-1}, + width:350 }, ], + scrollY:465, } }, props: { dataSource: { @@ -108,38 +112,47 @@ watch: { }, methods: { - } + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight + } + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, } </script> <style scoped> + .equipmentList{ + flex: 1; + overflow: hidden; + } + @media screen and (min-width: 1920px){ .equipmentList{ height: 640px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .equipmentList{ height: 640px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .equipmentList{ height: 493px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .equipmentList{ height: 493px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .equipmentList{ height: 394px!important; - overflow: scroll; } } diff --git a/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarList.vue b/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarList.vue index 5706370..6e3e8fe 100644 --- a/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarList.vue +++ b/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarList.vue @@ -1,12 +1,10 @@ <template> <div class="deviceCalendar_list"> - <div :bordered="false"> <!-- 鏌ヨ鍖哄煙 --> - <div> <div class="table-page-search-wrapper"> <a-form layout="inline" @keyup.enter.native="searchQuery"> - <a-row :gutter="24"> + <a-row :gutter="24" style="width: 100%"> <a-col :md="6" :sm="6"> <a-form-item label="鏃堕棿"> <a-range-picker @change="dateParamChange" format="YYYYMMDD" v-model="dates"/> @@ -34,9 +32,12 @@ </div> </div> - <div style="overflow: auto;width: 100%;margin-top: 20px;height: 569px;"> - <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" @change="handleTableChange" class="ant-table-striped" - :dataSource="dataSource" :pagination="ipagination" :loading="loading" :row-class-name="(_record, index) => (index % 2 === 1 ? 'table-striped' : null)"> + <div style="overflow: hidden;width: 100%;margin-top: 20px;flex: 1" id="DeviceList"> + <a-table ref="table" bordered :scroll="{x:'max-content',y:scrollY}" + size="middle" rowKey="id" :columns="columns" + @change="handleTableChange" class="ant-table-striped" + :dataSource="dataSource" :pagination="ipagination" + :loading="loading" :row-class-name="(_record, index) => (index % 2 === 1 ? 'table-striped' : null)"> <span slot="action" slot-scope="text, record"> <a-popconfirm @@ -53,7 +54,6 @@ </a-table> </div> <device-calendar-model ref="modalForm" @ok="modalFormOk"></device-calendar-model> - </div> </div> </template> @@ -79,6 +79,7 @@ identifying: [], queryParam: {}, disableMixinCreated: true, + scrollY:465, /* 鍒嗛〉鍙傛暟 */ ipagination:{ current: 1, @@ -96,60 +97,70 @@ title: '鏃ユ湡', align: 'center', dataIndex: 'effectiveDate', + width:100, }, { title: '璁惧缂栧彿', align: 'center', - dataIndex: 'equipmentId' + dataIndex: 'equipmentId', + width:150 }, { title: '璁惧鍚嶇О', align: 'center', dataIndex: 'equipmentName', + width:150 }, { title: '鐝埗', align: 'center', - dataIndex: 'shiftName' + dataIndex: 'shiftName', + width:150 }, { title: '鐝', align: 'center', - dataIndex: 'shiftSubName' + dataIndex: 'shiftSubName', + width:150 }, { title: '寮�濮嬫椂闂�', align: 'center', - dataIndex: 'startDate' + dataIndex: 'startDate', + width:140 }, { title: '缁撴潫鏃堕棿', align: 'center', - dataIndex: 'endDate' + dataIndex: 'endDate', + width:140 }, { title: '鏄惁璺ㄥぉ', align: 'center', dataIndex: 'isDaySpan', - scopedSlots: { customRender: 'isDaySpan' } + scopedSlots: { customRender: 'isDaySpan' }, + width:100 }, { title: '寮�濮嬩紤鎭椂闂�', align: 'center', - dataIndex: 'sleepStartDate' + dataIndex: 'sleepStartDate', + width:140 }, { title: '缁撴潫浼戞伅鏃堕棿', align: 'center', - dataIndex: 'sleepEndDate' + dataIndex: 'sleepEndDate', + width:140 }, { title: '鎿嶄綔', dataIndex: 'action', align: "center", - fixed: "right", - width: 147, - scopedSlots: { customRender: 'action' } + width: 100, + scopedSlots: { customRender: 'action' }, + fixed:'right' } ], checkedList: ['lyl'], @@ -167,6 +178,13 @@ this.queryParam.endTime = moment(this.dates[1]).format('YYYYMMDD') this.queryParam.typeTree = "1" this.loadData() + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) }, watch: { Type(valmath){ @@ -252,103 +270,50 @@ this.$refs.modalForm.add(record) this.$refs.modalForm.title = '璁惧宸ヤ綔鏃ュ巻閰嶇疆' this.$refs.modalForm.disableSubmit = false + }, + + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight - 50 } } } </script> <style scoped> + .deviceCalendar_list{ + overflow: hidden; + display: flex; + flex-direction: column; + } + @media screen and (min-width: 1920px){ .deviceCalendar_list{ height: 812px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .deviceCalendar_list{ height: 812px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .deviceCalendar_list{ height: 664px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .deviceCalendar_list{ height: 565px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .deviceCalendar_list{ height: 565px!important; - overflow: scroll; } } .ant-table-striped /deep/ .table-striped td { background-color: #fafafa; - } - .identifyingclass { - width: 55px; - height: 15px; - display: inline-block - } - - .dataContent { - border: 1px solid #ccc; - width: 100%; - /*height: 100%;*/ - overflow: hidden; - overflow-y: auto; - text-align: center; - } - - .dataContent .fixed th { - width: 50px; - } - - .dataContent .thead th { - background-color: #fafafa; - text-align: center; - height: 30px; - 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;*/ - } - - .pink { - background-color: #ff9bd2; - } - - .yellow { - background-color: #e8ff37; - } - - .green { - background-color: #99ff4e; } </style> \ No newline at end of file diff --git a/src/views/mdc/base/modules/deviceRepair/DeviceRepairList.vue b/src/views/mdc/base/modules/deviceRepair/DeviceRepairList.vue index bccdd0f..d187ef1 100644 --- a/src/views/mdc/base/modules/deviceRepair/DeviceRepairList.vue +++ b/src/views/mdc/base/modules/deviceRepair/DeviceRepairList.vue @@ -1,9 +1,9 @@ <template> - <div :bordered="false" class="device_list"> + <div class="device_list"> <!-- 鏌ヨ鍖哄煙 --> - <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper"> + <div style="background-color: #fff" class="table-page-search-wrapper"> <a-form layout="inline" @keyup.enter.native="searchQuery"> - <a-row :gutter="24"> + <a-row :gutter="24" style="width: 100%;"> <a-col :md="7" :sm="7"> <a-form-item label="鏃堕棿"> <a-range-picker @change="dateParamChange" v-model="dates" format="YYYY-MM-DD HH:mm:ss"/> @@ -23,7 +23,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="handleExportXls('缁翠慨浼戠彮绠$悊')" icon="download">瀵煎嚭</a-button> </a-space> </a-col> <!--<a-col :md="2" :sm="3" :xs="3">--> @@ -43,16 +42,17 @@ <div class="table-operator" style="display: inline;"> <a-button @click="handleAdd" type="primary" icon="plus">鏂板 </a-button> + <a-button type="primary" @click="handleExportXls('缁翠慨浼戠彮绠$悊')" icon="download">瀵煎嚭</a-button> <!--<a-button v-has="'user.add'" @click="handleAddXIU" type="primary" icon="plus">浼戠彮鏂板--> <!--</a-button>--> </div> <!-- table鍖哄煙-begin --> - <div id="DeviceList"> + <div id="DeviceList" style="flex: 1;overflow: hidden"> <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" - :scroll="{x:1000}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" + :dataSource="dataSource" :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" - @change="handleTableChange"> + @change="handleTableChange" :scroll="{x:'max-content',y:scrollY}"> <span slot="action" slot-scope="text, record"> <a @click="handleEdit(record)">缂栬緫</a> <a-divider type="vertical" /> @@ -128,28 +128,33 @@ queryParamEquip:{}, queryParamPeople:{}, dataStartsoucre:[], + scrollY:465, columns: [ { title: '璁惧缂栧彿', align: 'center', - dataIndex: 'equipmentId' + dataIndex: 'equipmentId', + width:250 }, { title: '璁惧鍚嶇О', align: 'center', dataIndex: 'equipmentName', defaultSortOrder:'descend', - sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1} + sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1}, + width:250 }, { title: '缁翠慨绫诲瀷', align: 'center', - dataIndex: 'mdcRepairTypeDictText' + dataIndex: 'mdcRepairTypeDictText', + width:250 }, { title: '寮�濮嬫椂闂�', align: 'center', dataIndex: 'startTime', + width:250 // scopedSlots:{customRender:'startTime'}, // customRender:(text,row,index) => { // return moment(text).format("YYYY-MM-DD HH:mm:ss") @@ -158,14 +163,16 @@ { title: '缁撴潫鏃堕棿', align: 'center', - dataIndex: 'endTime' + dataIndex: 'endTime', + width:250 }, { title: '鎿嶄綔', dataIndex: 'action', scopedSlots: {customRender: 'action'}, align: "center", - width: 150 + width: 150, + fixed:'right' } ], url: { @@ -559,9 +566,25 @@ exclude_inputs: true }); }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight - 50 + } }, created() { this.queryParam.typeTree = "1" + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) } } </script> @@ -569,34 +592,35 @@ <style lang="less" scoped> @import '~@assets/less/common.less'; + .device_list{ + overflow: hidden; + display: flex; + flex-direction: column; + } + @media screen and (min-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .device_list{ height: 663px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .device_list{ height: 564px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .device_list{ height: 564px!important; - overflow: scroll; } } </style> diff --git a/src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue b/src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue index 2d1f956..be9c4d5 100644 --- a/src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue +++ b/src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue @@ -19,12 +19,24 @@ <a-range-picker @change="dateParamChange" :disabledDate="disabledDate" format="YYYYMMDD" v-model="dates"/> </a-form-item> </a-col> - <a-col :md="14" :sm="14"> + <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"> + <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> </a-col> </a-row> <a-row :gutter="24"> @@ -35,20 +47,20 @@ </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 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"> @@ -80,9 +92,21 @@ <tbody> <tr class="mathData" v-for="(item, index) in dataList"> <template v-if="item.level1!=='鍚堣'&&item.level1!=='骞冲潎鍊�'"> - <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="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> @@ -457,12 +481,14 @@ 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;*/ @@ -470,30 +496,36 @@ 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; @@ -506,81 +538,91 @@ 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; - /*border: 1px solid #000;*/ } + .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; +} @media screen and (min-width: 1920px){ #EfficiencyPO{ height: 687px!important; - overflow: scroll; } } + @media screen and (min-width: 1680px) and (max-width: 1920px){ #EfficiencyPO{ height: 687px!important; - overflow: scroll; } } + @media screen and (min-width: 1400px) and (max-width: 1680px){ #EfficiencyPO{ height: 540px!important; - overflow: scroll; } } + @media screen and (min-width: 1280px) and (max-width: 1400px){ #EfficiencyPO{ height: 440px!important; - overflow: scroll; } } + @media screen and (max-width: 1280px){ #EfficiencyPO{ height: 440px!important; - overflow: scroll; } } + .identifyingclass { width: 55px; height: 15px; display: inline-block } + .dataContent { white-space: nowrap; /*margin: 0;*/ - border: none; border-collapse: separate; border-spacing: 0; /*table-layout: fixed;*/ @@ -591,10 +633,6 @@ /*overflow: hidden;*/ /*overflow-y: auto;*/ text-align: center; -} - -.dataContent .fixed th { - width: 50px; } .dataContent .thead th { @@ -608,23 +646,7 @@ 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;*/ -} - </style> \ No newline at end of file diff --git a/src/views/mdc/base/modules/efficiencyReport/EfficiencyList.vue b/src/views/mdc/base/modules/efficiencyReport/EfficiencyList.vue index d062e27..7f2f038 100644 --- a/src/views/mdc/base/modules/efficiencyReport/EfficiencyList.vue +++ b/src/views/mdc/base/modules/efficiencyReport/EfficiencyList.vue @@ -22,12 +22,24 @@ v-model="dates"/> </a-form-item> </a-col> - <a-col :md="14" :sm="14"> + <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"> + <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> </a-col> </a-row> <a-row :gutter="24"> @@ -38,20 +50,20 @@ </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 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"> @@ -91,14 +103,23 @@ <tr class="mathData" v-for="(item, index) in dataList"> <template v-if="item.level1!=='鍚堣'&&item.level1!=='骞冲潎鍊�'"> - <td class="tdgu kaitou wenzi" :rowspan="item.level1span" - :class="{hidden: item.level1dis,noExl:item.level1dis}" v-show="!item.level1dis">{{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 wenzi" :rowspan="item.level2span" - :class="{hidden: item.level2dis,noExl:item.level2dis}" v-show="!item.level2dis">{{item.level2}} + <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 wenzi" :rowspan="item.level3span" - :class="{hidden: item.level3dis,noExl:item.level3dis}" v-show="!item.level3dis">{{item.level3}} + :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> @@ -587,7 +608,6 @@ .table2 thead .equipname .dong1 { z-index: 4; left: 0; - /*border: 1px solid #000;*/ } .table2 thead .equipname .dong2 { @@ -615,50 +635,38 @@ left: 412px; } + #Efficiency{ + overflow: hidden; + } + @media screen and (min-width: 1920px) { #Efficiency { height: 687px !important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px) { #Efficiency { height: 687px !important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px) { #Efficiency { height: 540px !important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px) { #Efficiency { height: 440px !important; - overflow: scroll; } } @media screen and (max-width: 1280px) { #Efficiency { height: 440px !important; - overflow: scroll; } - } - - #Efficiency .table_guding1 { - position: absolute; - overflow: hidden; - width: 500px; - } - - #Efficiency .table_guding2 { - overflow-x: scroll; - width: 500px; } .identifyingclass { @@ -683,10 +691,6 @@ text-align: center; } - /*.dataContent .fixed th {*/ - /*width: 50px;*/ - /*}*/ - .dataContent .thead th { background-color: #fafafa; text-align: center; @@ -694,61 +698,11 @@ 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; } td { vertical-align: middle; } - - .pink { - background-color: #ff9bd2; - } - - .yellow { - background-color: #e8ff37; - } - - .green { - background-color: #99ff4e; - } - - .vertical-text { - writing-mode: vertical-rl; - } - - /*/deep/ .ant-table-body .ant-table-row td {*/ - /*padding-top: 10px;*/ - /*padding-bottom: 10px;*/ - /*}*/ - - /deep/ .ant-table-body .ant-table-row td.data { - min-width: 150px; - max-width: 150px; - } - - /deep/ .ant-table-tbody > tr.ant-table-row:hover > td { - background: none !important; - } - - /deep/ .ant-table-thead th { - text-align: center; - } - </style> \ No newline at end of file diff --git a/src/views/mdc/base/modules/efficiencyShiftReport/EfficiencyShiftList.vue b/src/views/mdc/base/modules/efficiencyShiftReport/EfficiencyShiftList.vue index 91078d8..c7adad0 100644 --- a/src/views/mdc/base/modules/efficiencyShiftReport/EfficiencyShiftList.vue +++ b/src/views/mdc/base/modules/efficiencyShiftReport/EfficiencyShiftList.vue @@ -39,20 +39,18 @@ </a-select> </a-form-item> </a-col> - </a-row> - <a-row :gutter="24"> - <a-col :md="9" :sm="9" :xs="9"> - <a-checkbox-group :value="checkedList" :default-value="['lyl']" :options="efficiencyOptions" - @change="efficiencyOptionsOnChange"/> - </a-col> - <a-col :md="5" :sm="5"> + <a-col :md="7" :sm="7" :xs="7"> <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> </a-col> - <a-col :md="10" :sm="10"> + </a-row> + <a-row :gutter="24"> + <a-col :md="24" :sm="24" :xs="24" style="display: flex;justify-content: space-between"> + <a-checkbox-group :value="checkedList" :default-value="['lyl']" :options="efficiencyOptions" + @change="efficiencyOptionsOnChange"/> <table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;"> <tr> <td v-for="(item, index) in identifying">{{item.title}}</td> @@ -118,9 +116,20 @@ <tbody> <tr class="mathData" v-for="(item, index) in dataList"> <template v-if="item.level1!=='鍚堣'&&item.level1!=='骞冲潎鍊�'"> - <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="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> @@ -590,27 +599,32 @@ 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; - /*border: 1px solid #000;*/ } + .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; @@ -619,43 +633,48 @@ z-index: 5; left: 250px; } + .table2 thead .equipname .dong6{ z-index: 5; left: 412px; } + .table2 thead .equipname .dong7{ z-index: 6; left: 512px; } + #EfficiencyShift{ + overflow: hidden; + } + @media screen and (min-width: 1920px){ #EfficiencyShift{ height: 670px!important; - overflow: scroll; } } + @media screen and (min-width: 1680px) and (max-width: 1920px){ #EfficiencyShift{ height: 670px!important; - overflow: scroll; } } + @media screen and (min-width: 1400px) and (max-width: 1680px){ #EfficiencyShift{ height: 522px!important; - overflow: scroll; } } + @media screen and (min-width: 1280px) and (max-width: 1400px){ #EfficiencyShift{ height: 414px!important; - overflow: scroll; } } + @media screen and (max-width: 1280px){ #EfficiencyShift{ height: 414px!important; - overflow: scroll; } } @@ -681,10 +700,6 @@ text-align: center; } - .dataContent .fixed th { - width: 50px; - } - .dataContent .thead th { background-color: #fafafa; text-align: center; @@ -692,31 +707,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 diff --git a/src/views/mdc/base/modules/mdcPassRate/mdcPassRateList.vue b/src/views/mdc/base/modules/mdcPassRate/mdcPassRateList.vue index 63b3d4a..8505d58 100644 --- a/src/views/mdc/base/modules/mdcPassRate/mdcPassRateList.vue +++ b/src/views/mdc/base/modules/mdcPassRate/mdcPassRateList.vue @@ -60,9 +60,9 @@ </div> <!-- table鍖哄煙-begin --> - <div id="DeviceList"> + <div id="DeviceList" style="flex: 1;overflow: hidden"> <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" - :scroll="{x:1000}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" + :scroll="{x:'max-content',y:scrollY}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" @change="handleTableChange"> @@ -107,8 +107,6 @@ } from '@/api/manage' import mdcPassRateModal from './mdcPassRateModal' import mdcPassRateEdit from './mdcPassRateEdit' - // import DeviceRepairModelAdd from './DeviceRepairModelAdd' - // import DeviceRepairModelEdit from './DeviceRepairModelEdit' import '@/components/table2excel/table2excel' import { JeecgListMixin @@ -117,17 +115,14 @@ import JEllipsis from '@/components/jeecg/JEllipsis' import Tooltip from 'ant-design-vue/es/tooltip' import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api' - import ACol from 'ant-design-vue/es/grid/Col' + export default { name: 'mdcPassRateList', mixins: [JeecgListMixin], components: { - ACol, Tooltip, mdcPassRateModal, mdcPassRateEdit, - // DeviceRepairModelAdd, - // DeviceRepairModelEdit, JDictSelectTag, JInput, JDate, @@ -147,16 +142,19 @@ queryParamEquip:{}, queryParamPeople:{}, dataStartsoucre:[], + scrollY:465, columns: [ { title: '璁惧缂栧彿', align: 'center', - dataIndex: 'equipmentId' + dataIndex: 'equipmentId', + width:200 }, { title: '璁惧鍚嶇О', align: 'center', dataIndex: 'equipmentName', + width:200 // defaultSortOrder:'descend', // sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1} }, @@ -164,6 +162,7 @@ title: '鏃ユ湡', align: 'center', dataIndex: 'efficientDate', + width:200 // scopedSlots:{customRender:'startTime'}, // customRender:(text,row,index) => { // return moment(text).format("YYYY-MM-DD HH:mm:ss") @@ -172,30 +171,35 @@ { title: '鍔犲伐鏁伴噺', align: 'center', - dataIndex: 'processQuantity' + dataIndex: 'processQuantity', + width:150 }, { title: '涓嶅悎鏍兼暟閲�', align: 'center', - dataIndex: 'unqualifiedQuantity' + dataIndex: 'unqualifiedQuantity', + width:150 }, { title: '鍚堟牸鐜�', align: 'center', dataIndex: 'passRate', - scopedSlots:{customRender:'discount1'} + scopedSlots:{customRender:'discount1'}, + width:150 }, { title: '澶囨敞', align: 'center', - dataIndex: 'remark' + dataIndex: 'remark', + width:200 }, { title: '鎿嶄綔', dataIndex: 'action', scopedSlots: {customRender: 'action'}, align: "center", + fixed:'right', width: 150 } ], @@ -685,9 +689,25 @@ exclude_inputs: true }); }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight - 50 + } }, created() { this.queryParam.typeTree = "1" + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) } } </script> @@ -695,34 +715,35 @@ <style lang="less" scoped> @import '~@assets/less/common.less'; + .device_list{ + overflow: hidden; + display: flex; + flex-direction: column; + } + @media screen and (min-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .device_list{ height: 663px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .device_list{ height: 564px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .device_list{ height: 564px!important; - overflow: scroll; } } </style> diff --git a/src/views/mdc/base/modules/mdcProcessQuantity/mdcProcessQuantityList.vue b/src/views/mdc/base/modules/mdcProcessQuantity/mdcProcessQuantityList.vue index 4ff7393..3cae1f0 100644 --- a/src/views/mdc/base/modules/mdcProcessQuantity/mdcProcessQuantityList.vue +++ b/src/views/mdc/base/modules/mdcProcessQuantity/mdcProcessQuantityList.vue @@ -60,9 +60,9 @@ </div> <!-- table鍖哄煙-begin --> - <div id="DeviceList"> + <div id="DeviceList" style="flex: 1;overflow: hidden"> <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" - :scroll="{x:1000}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" + :scroll="{x:'max-content',y:scrollY}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" @change="handleTableChange"> <span slot="action" slot-scope="text, record"> @@ -141,16 +141,19 @@ queryParamEquip:{}, queryParamPeople:{}, dataStartsoucre:[], + scrollY:465, columns: [ { title: '璁惧缂栧彿', align: 'center', - dataIndex: 'equipmentId' + dataIndex: 'equipmentId', + width:150 }, { title: '璁惧鍚嶇О', align: 'center', dataIndex: 'equipmentName', + width:200 // defaultSortOrder:'descend', // sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1} }, @@ -158,6 +161,7 @@ title: '闆朵欢鍙�', align: 'center', dataIndex: 'partsCode', + width:120 // scopedSlots:{customRender:'startTime'}, // customRender:(text,row,index) => { // return moment(text).format("YYYY-MM-DD HH:mm:ss") @@ -166,39 +170,46 @@ { title: '鎵规鍙�', align: 'center', - dataIndex: 'batchCode' + dataIndex: 'batchCode', + width:120 }, { title: '绋嬪簭鍙�', align: 'center', - dataIndex: 'sequenceNumber' + dataIndex: 'sequenceNumber', + width:120 }, { title: '鏃ユ湡', align: 'center', - dataIndex: 'efficientDate' + dataIndex: 'efficientDate', + width:150 }, { title: '鍔犲伐鏁伴噺', align: 'center', - dataIndex: 'processQuantity' + dataIndex: 'processQuantity', + width:120 }, { title: '鏃堕暱锛堝垎閽燂級', align: 'center', - dataIndex: 'duration' + dataIndex: 'duration', + width:120 }, { title: '澶囨敞', align: 'center', - dataIndex: 'remark' + dataIndex: 'remark', + width:120 }, { title: '鎿嶄綔', dataIndex: 'action', scopedSlots: {customRender: 'action'}, align: "center", - width: 150 + fixed:'right', + width: 200 } ], url: { @@ -688,9 +699,25 @@ exclude_inputs: true }); }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight - 50 + } }, created() { this.queryParam.typeTree = "1" + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) } } </script> @@ -698,34 +725,35 @@ <style lang="less" scoped> @import '~@assets/less/common.less'; + .device_list{ + overflow: hidden; + display: flex; + flex-direction: column; + } + @media screen and (min-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .device_list{ height: 663px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .device_list{ height: 564px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .device_list{ height: 564px!important; - overflow: scroll; } } </style> diff --git a/src/views/mdc/base/modules/mdcStandardProcessDuration/MdcStandardProcessDurationList.vue b/src/views/mdc/base/modules/mdcStandardProcessDuration/MdcStandardProcessDurationList.vue index 8bbf456..8a6bdcf 100644 --- a/src/views/mdc/base/modules/mdcStandardProcessDuration/MdcStandardProcessDurationList.vue +++ b/src/views/mdc/base/modules/mdcStandardProcessDuration/MdcStandardProcessDurationList.vue @@ -60,9 +60,9 @@ </div> <!-- table鍖哄煙-begin --> - <div id="DeviceList"> + <div id="DeviceList" style="flex: 1;overflow: hidden"> <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" - :scroll="{x:1000}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" + :scroll="{x:'max-content',y:scrollY}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" @change="handleTableChange"> <span slot="action" slot-scope="text, record"> @@ -141,16 +141,19 @@ queryParamEquip:{}, queryParamPeople:{}, dataStartsoucre:[], + scrollY:465, columns: [ { title: '璁惧缂栧彿', align: 'center', - dataIndex: 'equipmentId' + dataIndex: 'equipmentId', + width:200 }, { title: '璁惧鍚嶇О', align: 'center', dataIndex: 'equipmentName', + width:200 // defaultSortOrder:'descend', // sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1} }, @@ -158,6 +161,7 @@ title: '闆朵欢鍙�', align: 'center', dataIndex: 'partsCode', + width:150 // scopedSlots:{customRender:'startTime'}, // customRender:(text,row,index) => { // return moment(text).format("YYYY-MM-DD HH:mm:ss") @@ -166,28 +170,33 @@ { title: '鎵规鍙�', align: 'center', - dataIndex: 'batchCode' + dataIndex: 'batchCode', + width:150 }, { title: '绋嬪簭鍙�', align: 'center', - dataIndex: 'sequenceNumber' + dataIndex: 'sequenceNumber', + width:150 }, { title: '鏃堕暱锛堝垎閽燂級', align: 'center', - dataIndex: 'duration' + dataIndex: 'duration', + width:150 }, { title: '澶囨敞', align: 'center', - dataIndex: 'remark' + dataIndex: 'remark', + width:250 }, { title: '鎿嶄綔', dataIndex: 'action', scopedSlots: {customRender: 'action'}, align: "center", + fixed:'right', width: 150 } ], @@ -677,9 +686,25 @@ exclude_inputs: true }); }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2) + const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) + this.scrollY = boxHeight - tableHeadHeight - 50 + } }, created() { this.queryParam.typeTree = "1" + }, + mounted(){ + window.addEventListener('resize',this.handleWindowResize) + this.handleWindowResize() + }, + beforeDestroy(){ + window.removeEventListener('resize',this.handleWindowResize) } } </script> @@ -687,34 +712,35 @@ <style lang="less" scoped> @import '~@assets/less/common.less'; + .device_list{ + overflow: hidden; + display: flex; + flex-direction: column; + } + @media screen and (min-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .device_list{ height: 811px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .device_list{ height: 663px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .device_list{ height: 564px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .device_list{ height: 564px!important; - overflow: scroll; } } </style> diff --git a/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue b/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue index db3e659..630964f 100644 --- a/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue +++ b/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue @@ -11,23 +11,22 @@ v-model="dates"/> </a-form-item> </a-col> - <a-col :md="6" :sm="6" :xs="6"> + <a-col :md="17" :sm="17" :xs="17"> <a-form-item label="鏃堕棿娈�"> - <a-time-picker :default-value="moment('00:00', 'HH:mm')" format="HH:mm" @change="onChangeStart"/> - 鑷� - <a-time-picker :default-value="moment('08:00', 'HH:mm')" format="HH:mm" @change="onChangeEnd"/> + <a-space> + <a-time-picker :default-value="moment('00:00', 'HH:mm')" format="HH:mm" @change="onChangeStart"/> + 鑷� + <a-time-picker :default-value="moment('08:00', 'HH:mm')" format="HH:mm" @change="onChangeEnd"/> + <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> + </a-space> </a-form-item> - </a-col> - <a-col :lg="2" :md="3" :sm="3" :xs="3"> - <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> </a-col> </a-row> </a-form> </div> <div id="DeviceList"> - <div class="openRateTrendDg"> - <div id="Efficiency" class="container" style="margin-top: 20px;"> - <a-spin :spinning="loading"> + <a-spin :spinning="loading"> + <div id="Efficiency" class="container" style="margin-bottom: 15px;"> <div class="table2"> <table class="dataContent table" border="1" cellspacing="0" cellpadding="0" style="white-space: nowrap;text-align: center;"> @@ -36,7 +35,7 @@ <th class="thgu dong1 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;"> 璁惧缂栧彿 </th> - <th class="thgu dong2 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;"> + <th class="thgu dong2 name" rowspan="2" style="min-width: 162px; max-width: 162px;width: 162px;"> 璁惧鍚嶇О </th> <th class="thgu dong3 name" rowspan="2" style="min-width: 100px; max-width: 100px;width: 100px;"> @@ -59,10 +58,10 @@ </tbody> </table> </div> - </a-spin> </div> - </div> - <div id="openRateTrendChart" style="width: 100%;height: 60%"></div> + </a-spin> + + <div id="openRateTrendChart"></div> </div> </div> </div> @@ -81,7 +80,6 @@ export default { // mixins: [JeecgListMixin], name: 'openRateFractionAnalysisMain', - components: {}, data() { return { dataSource: [], @@ -137,9 +135,11 @@ }, mounted() { this.tableScroll = document.querySelector('.table2') + window.addEventListener('resize',this.handleWindowResize) }, beforeDestroy() { this.tableScroll.removeEventListener('scroll', this.tableScrollX) + window.removeEventListener('resize',this.handleWindowResize) }, watch: { Type(valmath) { @@ -343,7 +343,7 @@ }) }, draw() { - let openRateTrendAnalysisChart = this.$echarts.init(document.getElementById('openRateTrendChart'), 'macarons') + this.openRateTrendAnalysisChart = this.$echarts.init(document.getElementById('openRateTrendChart'), 'macarons') let openRateTrendChartOptions = { title: { text: '鍒╃敤鐜囧垎娈靛垎鏋�', @@ -398,7 +398,7 @@ } ] } - openRateTrendAnalysisChart.setOption(openRateTrendChartOptions, true) + this.openRateTrendAnalysisChart.setOption(openRateTrendChartOptions, true) }, /** @@ -434,6 +434,13 @@ this.loading = false }) } + }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + if(this.openRateTrendAnalysisChart) this.openRateTrendAnalysisChart.resize() } } } @@ -455,19 +462,11 @@ text-align: center; } - /*.dataContent .fixed th {*/ - /*width: 50px;*/ - /*}*/ - .dataContent .thead th { background-color: #fafafa; text-align: center; height: 30px; padding: 5px; - } - - .dataContent .notfixed th { - /*width: auto;*/ } .dataContent tr td { @@ -476,22 +475,11 @@ .dataContent .mathData td { padding: 10px; - /*display: none;*/ cursor: pointer; } .dataContent .mathData:hover td { background-color: #e6f7ff; - } - - .dataContent .mathData .td { - /*background-color: #ff9bd2;*/ - display: inline-block; - padding: 10px; - } - - .dataContent .mathData .tdd { - /*display: none;*/ } .table2 { @@ -500,12 +488,6 @@ overflow: auto; } - /*tr th {*/ - /*height: 50px!important;*/ - /*}*/ - /*tr td{*/ - /*height: 50px!important;*/ - /*}*/ .table2 thead tr th:first-child, .table tbody tr .tdgu { position: sticky; @@ -526,25 +508,7 @@ .table tbody tr .tdgu2 { position: sticky; - left: 300px; - z-index: 2; - } - - .table tbody tr .tdgu3 { - position: sticky; - left: 450px; - z-index: 2; - } - - .table tbody tr .tdgu4 { - position: sticky; - left: 550px; - z-index: 2; - } - - .table tbody tr .tdgu5 { - position: sticky; - left: 700px; + left: 312px; z-index: 2; } @@ -568,7 +532,6 @@ .table2 thead .equipname .dong1 { z-index: 4; left: 0; - /*border: 1px solid #000;*/ } .table2 thead .equipname .dong2 { @@ -578,79 +541,49 @@ .table2 thead .equipname .dong3 { z-index: 5; - left: 300px; + left: 312px; } - .table2 thead .equipname .dong4 { - z-index: 5; - left: 450px; + .efficiency_list #DeviceList { + height: 90% !important; } - .table2 thead .equipname .dong5 { - z-index: 5; - left: 550px; + #Efficiency{ + overflow: hidden; } - .table2 thead .equipname .dong6 { - z-index: 5; - left: 700px; + #openRateTrendChart{ + width: 100%; + height: 60% } @media screen and (min-width: 1920px) { #Efficiency { height: 337px !important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px) { #Efficiency { height: 337px !important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px) { #Efficiency { - height: 190px !important; - overflow: scroll; + height: 337px !important; } } @media screen and (min-width: 1280px) and (max-width: 1400px) { #Efficiency { - height: 90px !important; - overflow: scroll; + height: 200px !important; } } @media screen and (max-width: 1280px) { #Efficiency { - height: 90px !important; - overflow: scroll; + height: 200px !important; } - } - - #Efficiency .table_guding1 { - position: absolute; - overflow: hidden; - width: 500px; - } - - #Efficiency .table_guding2 { - overflow-x: scroll; - width: 500px; - } - - /deep/ .ant-card { - height: 100% !important; - } - - /deep/ .ant-card .ant-card-body { - height: 100% !important; - } - - .efficiency_list #DeviceList { - height: 90% !important; } </style> \ No newline at end of file diff --git a/src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue b/src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue index fadbf53..6f33288 100644 --- a/src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue +++ b/src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue @@ -5,7 +5,7 @@ <div class="table-page-search-wrapper"> <a-form layout="inline" @keyup.enter.native="searchQuery"> <a-row :gutter="24"> - <a-col :md="6" :sm="6"> + <a-col :md="7" :sm="7"> <a-form-item label="鏃堕棿"> <a-range-picker @change="dateParamChange" :disabledDate="disabledDate" format="YYYYMMDD" v-model="dates"/> @@ -17,10 +17,12 @@ </a-row> </a-form> </div> + + <!--琛ㄦ牸鍙婂浘琛ㄥ尯鍩�--> <div id="DeviceList"> - <div class="openRateTrendDg"> - <div id="Efficiency" class="container" style="margin-top: 20px;"> - <a-spin :spinning="loading"> + <!--琛ㄦ牸鍖哄煙--> + <a-spin :spinning="loading"> + <div id="Efficiency" class="container" style="margin-bottom: 15px;"> <div class="table2"> <table class="dataContent table" border="1" cellspacing="0" cellpadding="0" style="white-space: nowrap;text-align: center;"> @@ -29,7 +31,7 @@ <th class="thgu dong1 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;"> 璁惧缂栧彿 </th> - <th class="thgu dong2 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;"> + <th class="thgu dong2 name" rowspan="2" style="min-width: 162px; max-width: 162px;width: 162px;"> 璁惧鍚嶇О </th> <th class="thgu dong3 name" rowspan="2" style="min-width: 100px; max-width: 100px;width: 100px;"> @@ -52,10 +54,10 @@ </tbody> </table> </div> - </a-spin> </div> - </div> - <div id="openRateTrendChart" style="width: 100%;height: 60%"></div> + </a-spin> + <!--鍥炬爣鍖哄煙--> + <div id="openRateTrendChart"></div> </div> </div> </div> @@ -127,9 +129,11 @@ }, mounted() { this.tableScroll = document.querySelector('.table2') + window.addEventListener('resize',this.handleWindowResize) }, beforeDestroy() { this.tableScroll.removeEventListener('scroll', this.tableScrollX) + window.removeEventListener('resize',this.handleWindowResize) }, watch: { Type(valmath) { @@ -351,7 +355,7 @@ }) }, draw() { - let openRateTrendAnalysisChart = this.$echarts.init(document.getElementById('openRateTrendChart'), 'macarons') + this.openRateTrendAnalysisChart = this.$echarts.init(document.getElementById('openRateTrendChart'), 'macarons') let openRateTrendChartOptions = { title: { text: '鍒╃敤鐜囪蛋鍔垮垎鏋�', @@ -406,7 +410,7 @@ } ] } - openRateTrendAnalysisChart.setOption(openRateTrendChartOptions, true) + this.openRateTrendAnalysisChart.setOption(openRateTrendChartOptions, true) }, /** @@ -442,6 +446,13 @@ this.loading = false }) } + }, + + /** + * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙� + */ + handleWindowResize(){ + if(this.openRateTrendAnalysisChart) this.openRateTrendAnalysisChart.resize() } } } @@ -457,15 +468,8 @@ border: 1px solid #ccc; /*border: 1px solid #ccc;*/ width: 100%; - /*height: 100%;*/ - /*overflow: hidden;*/ - /*overflow-y: auto;*/ text-align: center; } - - /*.dataContent .fixed th {*/ - /*width: 50px;*/ - /*}*/ .dataContent .thead th { background-color: #fafafa; @@ -474,32 +478,17 @@ padding: 5px; } - .dataContent .notfixed th { - /*width: auto;*/ - } - .dataContent tr td { height: 35px; } .dataContent .mathData td { padding: 10px; - /*display: none;*/ cursor: pointer; } .dataContent .mathData:hover td { background-color: #e6f7ff; - } - - .dataContent .mathData .td { - /*background-color: #ff9bd2;*/ - display: inline-block; - padding: 10px; - } - - .dataContent .mathData .tdd { - /*display: none;*/ } .table2 { @@ -508,12 +497,6 @@ overflow: auto; } - /*tr th {*/ - /*height: 50px!important;*/ - /*}*/ - /*tr td{*/ - /*height: 50px!important;*/ - /*}*/ .table2 thead tr th:first-child, .table tbody tr .tdgu { position: sticky; @@ -534,25 +517,7 @@ .table tbody tr .tdgu2 { position: sticky; - left: 300px; - z-index: 2; - } - - .table tbody tr .tdgu3 { - position: sticky; - left: 450px; - z-index: 2; - } - - .table tbody tr .tdgu4 { - position: sticky; - left: 550px; - z-index: 2; - } - - .table tbody tr .tdgu5 { - position: sticky; - left: 700px; + left: 312px; z-index: 2; } @@ -576,7 +541,6 @@ .table2 thead .equipname .dong1 { z-index: 4; left: 0; - /*border: 1px solid #000;*/ } .table2 thead .equipname .dong2 { @@ -586,79 +550,51 @@ .table2 thead .equipname .dong3 { z-index: 5; - left: 300px; + left: 312px; } - .table2 thead .equipname .dong4 { - z-index: 5; - left: 450px; + .efficiency_list #DeviceList { + height: 90% !important; } - .table2 thead .equipname .dong5 { - z-index: 5; - left: 550px; + #Efficiency{ + overflow: hidden; } - .table2 thead .equipname .dong6 { - z-index: 5; - left: 700px; + #openRateTrendChart{ + width: 100%; + height: 60%; } @media screen and (min-width: 1920px) { #Efficiency { height: 337px !important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px) { #Efficiency { height: 337px !important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px) { #Efficiency { - height: 190px !important; - overflow: scroll; + height: 337px !important; } } @media screen and (min-width: 1280px) and (max-width: 1400px) { #Efficiency { - height: 90px !important; - overflow: scroll; + height: 200px !important; } } @media screen and (max-width: 1280px) { #Efficiency { - height: 90px !important; - overflow: scroll; + height: 200px !important; } } - #Efficiency .table_guding1 { - position: absolute; - overflow: hidden; - width: 500px; - } - #Efficiency .table_guding2 { - overflow-x: scroll; - width: 500px; - } - - /deep/ .ant-card { - height: 100% !important; - } - - /deep/ .ant-card .ant-card-body { - height: 100% !important; - } - - .efficiency_list #DeviceList { - height: 90% !important; - } </style> \ No newline at end of file diff --git a/src/views/mdc/base/modules/shift/ShiftInfo.vue b/src/views/mdc/base/modules/shift/ShiftInfo.vue index 19a856d..e6d104e 100644 --- a/src/views/mdc/base/modules/shift/ShiftInfo.vue +++ b/src/views/mdc/base/modules/shift/ShiftInfo.vue @@ -1,11 +1,11 @@ <template> - <a-card :bordered="false" class="shift_info"> + <div class="shift_info"> <!-- 鎿嶄綔鎸夐挳鍖哄煙 --> <div class="table-operator"> <a-button type="primary" v-if="Object.keys(shiftSystemRow).length>0" @click="handleAdd" icon="plus">閰嶇疆</a-button> </div> <!-- table鍖哄煙-begin --> - <div style="width: 100%;"> + <div style="width: 100%;flex: 1;overflow: auto"> <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" :dataSource="dataSource" :pagination="false" :loading="loading"> <span @@ -50,7 +50,7 @@ </div> <shift-info-model ref="modalForm" @ok="modalFormOk"></shift-info-model> - </a-card> + </div> </template> <script> @@ -201,34 +201,35 @@ </script> <style lang="less" scoped> + .shift_info{ + overflow: hidden; + display: flex; + flex-direction: column; + } + @media screen and (min-width: 1920px){ .shift_info{ height: 748px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .shift_info{ height: 748px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .shift_info{ height: 600px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .shift_info{ height: 501px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .shift_info{ height: 501px!important; - overflow: scroll; } } </style> diff --git a/src/views/mdc/base/modules/shift/ShiftSystem.vue b/src/views/mdc/base/modules/shift/ShiftSystem.vue index 3d53d7d..7197ad4 100644 --- a/src/views/mdc/base/modules/shift/ShiftSystem.vue +++ b/src/views/mdc/base/modules/shift/ShiftSystem.vue @@ -1,11 +1,11 @@ <template> - <a-card :bordered="false" class="shift_system"> + <div class="shift_system"> <!-- 鎿嶄綔鎸夐挳鍖哄煙 --> <div class="table-operator"> <a-button type="primary" @click="handleAdd" icon="plus">鏂板</a-button> </div> <!-- table鍖哄煙-begin --> - <div> + <div style="flex: 1;overflow: auto"> <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" :dataSource="dataSource" :pagination="false" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange,type:'radio'}"> @@ -55,7 +55,7 @@ </div> <shift-system-model ref="modalForm" @ok="modalFormOk"></shift-system-model> - </a-card> + </div> </template> <script> @@ -195,34 +195,35 @@ </script> <style lang="less" scoped> + .shift_system{ + overflow: auto; + display: flex; + flex-direction: column; + } + @media screen and (min-width: 1920px){ .shift_system{ height: 748px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .shift_system{ height: 748px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .shift_system{ height: 600px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .shift_system{ height: 501px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .shift_system{ height: 501px!important; - overflow: scroll; } } </style> diff --git a/src/views/mdc/base/openRateFractionAnalysis.vue b/src/views/mdc/base/openRateFractionAnalysis.vue index 3d0ce5c..d732ace 100644 --- a/src/views/mdc/base/openRateFractionAnalysis.vue +++ b/src/views/mdc/base/openRateFractionAnalysis.vue @@ -2,7 +2,7 @@ <div style="width: 100%; height: 100%;"> <a-card :bordered="false"> <a-row type="flex" :gutter="16"> - <a-col :md="4"> + <a-col :md="5"> <a-tabs :activeKey="activeKey" @change="tabChange"> <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> <base-tree @getCurrSelected="changeSelectionNode"></base-tree> @@ -12,7 +12,7 @@ </a-tab-pane> </a-tabs> </a-col> - <a-col :md="20"> + <a-col :md="19"> <open-rate-fraction-analysis-main ref="openRateFractionAnalysisMain" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></open-rate-fraction-analysis-main> </a-col> </a-row> diff --git a/src/views/mdc/base/openRateTrendAnalysis.vue b/src/views/mdc/base/openRateTrendAnalysis.vue index 027b1b4..0277ccc 100644 --- a/src/views/mdc/base/openRateTrendAnalysis.vue +++ b/src/views/mdc/base/openRateTrendAnalysis.vue @@ -2,7 +2,7 @@ <div style="width: 100%; height: 100%;"> <a-card :bordered="false"> <a-row type="flex" :gutter="16"> - <a-col :md="4"> + <a-col :md="5"> <a-tabs :activeKey="activeKey" @change="tabChange"> <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> <base-tree @getCurrSelected="changeSelectionNode"></base-tree> @@ -12,7 +12,7 @@ </a-tab-pane> </a-tabs> </a-col> - <a-col :md="20"> + <a-col :md="19"> <open-rate-trend-analysis-main ref="EfficiencyList" :nodePeople='selectPeople' :nodeTree = 'selectEquement' :Type="slectTypeTree"></open-rate-trend-analysis-main> </a-col> </a-row> diff --git a/src/views/mdc/common/BaseTree.vue b/src/views/mdc/common/BaseTree.vue index 1eebf9d..c94bd5f 100644 --- a/src/views/mdc/common/BaseTree.vue +++ b/src/views/mdc/common/BaseTree.vue @@ -1,56 +1,62 @@ <template> <a-card class="tree_con" :loading="cardLoading" :bordered="false" > <a-spin :spinning="loading"> - <a-alert type="info" :showIcon="false" style="margin-right: 54px;padding-left: 5px"> - <div slot="message"> - <span v-if="this.currSelected.title">{{ getCurrSelectedTitle() }}</span> - <a v-if="this.currSelected.title" style="margin-left: 10px" @click="onClearSelected">鍙栨秷</a> - <span v-else>鏃�</span> - </div> - </a-alert> - <div class="drawer-bootom-button"> - <a-dropdown :trigger="['click']" placement="bottomCenter"> - <a-menu slot="overlay"> - <a-menu-item key="1" @click="expandAll">灞曞紑鎵�鏈�</a-menu-item> - <a-menu-item key="2" @click="closeAll">鍚堝苟鎵�鏈�</a-menu-item> - <a-menu-item key="3" @click="refreshTree">鍒锋柊</a-menu-item> - </a-menu> - <a-button> - <a-icon type="bars"/> - </a-button> - </a-dropdown> - </div> - <a-input-search @search="handleSearch" style="width:100%;margin-top: 10px" placeholder="妫�绱� 绫诲埆缂栫爜/鍚嶇О" allowClear - v-model="searchInput" @change="handleChange"/> - <!-- showLine --> - <a-tree showLine ref="tree" :checkStrictly="checkStrictly" :expandedKeys.sync="expandedKeys" - :selectedKeys="selectedKeys" :dropdownStyle="{maxHeight:'200px',overflow:'auto'}" - :treeData="treeDataSource" - :autoExpandParent="autoExpandParent" @select="onSelect" @expand="onExpand" slots="{}"> - <template slot="title" slot-scope="{ title, parentId, entity, key}"> + <div style="display: flex;flex-direction: column;height: 100%"> + <div> + <a-alert type="info" :showIcon="false" style="margin-right: 54px;padding-left: 5px"> + <div slot="message"> + <span v-if="this.currSelected.title">{{ getCurrSelectedTitle() }}</span> + <a v-if="this.currSelected.title" style="margin-left: 10px" @click="onClearSelected">鍙栨秷</a> + <span v-else>鏃�</span> + </div> + </a-alert> + <div class="drawer-bottom-button"> + <a-dropdown :trigger="['click']" placement="bottomCenter"> + <a-menu slot="overlay"> + <a-menu-item key="1" @click="expandAll">灞曞紑鎵�鏈�</a-menu-item> + <a-menu-item key="2" @click="closeAll">鍚堝苟鎵�鏈�</a-menu-item> + <a-menu-item key="3" @click="refreshTree">鍒锋柊</a-menu-item> + </a-menu> + <a-button> + <a-icon type="bars"/> + </a-button> + </a-dropdown> + </div> + </div> + <a-input-search @search="handleSearch" style="width:100%;margin-top: 10px" placeholder="妫�绱� 绫诲埆缂栫爜/鍚嶇О" allowClear + v-model="searchInput" @change="handleChange"/> + <!-- showLine --> + <div style="flex: 1;overflow:auto;margin-top: 10px"> + <a-tree showLine ref="tree" :checkStrictly="checkStrictly" :expandedKeys.sync="expandedKeys" + :selectedKeys="selectedKeys" :dropdownStyle="{maxHeight:'200px',overflow:'auto'}" + :treeData="treeDataSource" + :autoExpandParent="autoExpandParent" @select="onSelect" @expand="onExpand" slots="{}"> + <template slot="title" slot-scope="{ title, parentId, entity, key}"> <span v-if="title.indexOf(searchValue) > -1"> {{ title.substr(0, title.indexOf(searchValue)) }} <span class="replaceSearch">{{ searchValue }}</span> {{ title.substr(title.indexOf(searchValue) + searchValue.length) }} </span> - <span v-else>{{ title }}</span> - <a-dropdown v-if="!editDisable && entity.parentId == -1" :trigger="['click']" placement="bottomCenter"> - <a-menu slot="overlay"> - <a-menu-item> - <a href="javascript:;" @click="handleEdit(entity)">缂栬緫</a> - </a-menu-item> - <a-menu-item> - <a href="javascript:;" @click="batchDel(entity)"> - 鍒犻櫎 - </a> - </a-menu-item> - </a-menu> - <span :style="{position: 'absolute',right: 0}"> + <span v-else>{{ title }}</span> + <a-dropdown v-if="!editDisable && entity.parentId == -1" :trigger="['click']" placement="bottomCenter"> + <a-menu slot="overlay"> + <a-menu-item> + <a href="javascript:;" @click="handleEdit(entity)">缂栬緫</a> + </a-menu-item> + <a-menu-item> + <a href="javascript:;" @click="batchDel(entity)"> + 鍒犻櫎 + </a> + </a-menu-item> + </a-menu> + <span :style="{position: 'absolute',right: 0}"> <a-icon type="down"/> </span> - </a-dropdown> - </template> - </a-tree> + </a-dropdown> + </template> + </a-tree> + </div> + </div> </a-spin> <tier-model ref="tierModalForm" @ok="modalFormOk"></tier-model> </a-card> @@ -356,7 +362,7 @@ padding: 5px 15px 5px 37px; } - .drawer-bootom-button { + .drawer-bottom-button { position: absolute; top: 1px; /* padding: 10px 16px; */ @@ -365,34 +371,38 @@ background: #fff; border-radius: 0 0 2px 2px; } + + .tree_con{ + overflow: hidden; + } + @media screen and (min-width: 1920px){ .tree_con{ height: 748px!important; - overflow: scroll; } } @media screen and (min-width: 1680px) and (max-width: 1920px){ .tree_con{ height: 748px!important; - overflow: scroll; } } @media screen and (min-width: 1400px) and (max-width: 1680px){ .tree_con{ height: 600px!important; - overflow: scroll; } } @media screen and (min-width: 1280px) and (max-width: 1400px){ .tree_con{ height: 501px!important; - overflow: scroll; } } @media screen and (max-width: 1280px){ .tree_con{ height: 501px!important; - overflow: scroll; } } + + /deep/ .ant-card-body,/deep/ .ant-spin-nested-loading,/deep/ .ant-spin-container{ + height: 100%; + } </style> -- Gitblit v1.9.3