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/deviceCalendar/DeviceCalendarList.vue | 131 ++++++++++++++++---------------------------
1 files changed, 48 insertions(+), 83 deletions(-)
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
--
Gitblit v1.9.3