Browse Source

主要设备清单 钻取表 上部表格宽度修改,添加滚动条

yx 4 years ago
parent
commit
032b6e903d

+ 12 - 16
src/views/equipment/table/eqDetaileDialog.vue

@@ -59,9 +59,10 @@
                 <input-dialog :type='1' @confirm='confirm'></input-dialog>
             </div>
             <div class='gdqd-dialog-bottom'>
+                <!-- TODO: 宽度修改 -->
                 <el-table @row-click='innerTable' :data='tableData' :key='key' :border='true' style='width: 100%' :highlight-current-row='true'>
                     <el-table-column type='index' label='序号' width='60'></el-table-column>
-                    <el-table-column prop='sbjc' label='设备名称' show-overflow-tooltip resizable min-width='500'>
+                    <el-table-column prop='sbjc' label='设备名称' show-overflow-tooltip resizable min-width='338'>
                         <template slot-scope='{row}'>{{row.sbjc || '--'}}</template>
                     </el-table-column>
                     <el-table-column prop='assetnum' label='设备内码' show-overflow-tooltip resizable width='80'>
@@ -76,19 +77,19 @@
                     <el-table-column prop='brand' label='品牌' show-overflow-tooltip resizable width='80'>
                         <template slot-scope='{row}'>{{row.brand || '--'}}</template>
                     </el-table-column>
-                    <el-table-column prop='sbxh' label='型号' show-overflow-tooltip resizable width='80'>
+                    <el-table-column prop='sbxh' label='型号' show-overflow-tooltip resizable width='100'>
                         <template slot-scope='{row}'>{{row.sbxh || '--'}}</template>
                     </el-table-column>
                     <el-table-column prop='floor' sortable label='楼层' width='70' show-overflow-tooltip resizable>
                         <template slot-scope='{row}'>{{row.floorcode || '--'}}</template>
                     </el-table-column>
-                    <el-table-column prop='wzjc' label='安装位置' show-overflow-tooltip resizable min-width='150'>
+                    <el-table-column prop='wzjc' label='安装位置' show-overflow-tooltip resizable min-width='250'>
                         <template slot-scope='{row}'>{{row.wzjc || '--'}}</template>
                     </el-table-column>
-                    <el-table-column prop='manufacturer' label='生产厂商' show-overflow-tooltip resizable min-width='150'>
+                    <el-table-column prop='manufacturer' label='生产厂商' show-overflow-tooltip resizable min-width='300'>
                         <template slot-scope='{row}'>{{row.manufacturer || '--'}}</template>
                     </el-table-column>
-                    <el-table-column prop='fws' label='服务商' show-overflow-tooltip resizable min-width='150'>
+                    <el-table-column prop='fws' label='服务商' show-overflow-tooltip resizable min-width='300'>
                         <template slot-scope='{row}'>{{row.fws || '--'}}</template>
                     </el-table-column>
                     <el-table-column prop label='相关资料' show-overflow-tooltip resizable min-width='150'>
@@ -385,9 +386,12 @@ export default {
     height: 90vh;
     .gdqd-top {
         .gdqd-dialog-bottom {
-            overflow: auto;
-            max-height: 17.6vh;
             margin-top: 20px;
+            // 表格主体(数据列,不含表头),高度
+            /deep/.el-table__body-wrapper {
+                overflow: auto;
+                max-height: 13.6vh;
+            }
         }
     }
     // 底部表格
@@ -447,20 +451,12 @@ export default {
     .gdqd-dialog td {
         padding: 4px 0;
     }
-    .gdqd-dialog-bottom {
-        max-height: 20vh !important;
-    }
 }
 @media screen and (max-width: 1366px) {
     .gdqd-dialog {
         /deep/ .el-table td {
             padding: 1px 0 !important;
         }
-        .gdqd-dialog-bottom {
-            max-height: 20vh !important;
-            margin-top: 10px !important;
-        }
-
         .table-bottom {
             .title {
                 height: 60px !important;
@@ -475,7 +471,7 @@ export default {
 </style>
 <style lang="less">
 .gdqd-dialog {
-    /deep/.el-table td {
+    /deep/.el-table__body-wrapper td {
         cursor: pointer;
     }
     .el-dialog__header {

+ 2 - 2
src/views/equipment/table/inputDIalog.vue

@@ -11,7 +11,7 @@
         <div
             v-if='dialogFormVisible'
             style='width:280px;height:250px;background:rgba(255,255,255,1);margin-top:40px;
-            box-shadow:0px 2px 10px 0px rgba(31,35,41,0.1);border:1px solid rgba(228,229,231,1);z-index:9999;
+            box-shadow:0px 2px 10px 0px rgba(31,35,41,0.1);border:1px solid rgba(228,229,231,1);z-index:10000;
             position:absolute;'
             :style='`right:${type === 1 ? "40px" : "0"};height:${type === 6 || type === 5? "420px":"250px"}`'
         >
@@ -149,7 +149,7 @@
                     v-model='inputForm.ycgdyssj'
                 ></el-date-picker>
             </el-form>
-            <div style='position:absolute;bottom:24px;right:24px;z-index:9999'>
+            <div style='position:absolute;bottom:24px;right:24px;z-index:10000'>
                 <el-button @click='dialogFormVisible = false' size='small'>取 消</el-button>
                 <el-button type='primary' @click='confirm' size='small'>确 定</el-button>
             </div>