|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<div class="container">
|
|
|
- <el-header class="bg-blue" style="width: 1210px;margin:0 auto;">
|
|
|
+ <el-header class="bg-blue header" style="margin:0 auto;">
|
|
|
<!-- <el-image :src="logo" style="width: 50px; height: 50px" fit="fill" />-->
|
|
|
<el-row>
|
|
|
<el-col :span="8">
|
|
@@ -15,7 +15,7 @@
|
|
|
</el-row>
|
|
|
</el-header>
|
|
|
<div class="floor-container" :style="{height:floorContainerHeight+'px' }">
|
|
|
-
|
|
|
+ <el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: (floorContainerHeight)+'px'}">
|
|
|
<div class="tpl-box" :style="tplBoxStyle">
|
|
|
<draggable v-model="templateArray" :options="tplOptions" class="tpl-list">
|
|
|
<div v-for="item in templateArray" :class="'item-' + item.tpl_id" class="tpl-item">
|
|
@@ -62,7 +62,7 @@
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
-
|
|
|
+ </el-scrollbar>
|
|
|
</div>
|
|
|
|
|
|
<board-item-setting
|
|
@@ -299,6 +299,18 @@
|
|
|
width: 100%;
|
|
|
|
|
|
}
|
|
|
+ .header{
|
|
|
+ width: 1210px;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+ @media (max-width: 1300px) {
|
|
|
+ .header{
|
|
|
+ width: 900px;
|
|
|
+ }
|
|
|
+ .container {
|
|
|
+ min-width: 1000px;
|
|
|
+ }
|
|
|
+ }
|
|
|
.draggable-box .floor {
|
|
|
width: 800px + 50px;
|
|
|
flex-shrink: 0;
|
|
@@ -351,11 +363,11 @@
|
|
|
justify-content: center;
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
- overflow-y: scroll;
|
|
|
+ /*overflow-y: hidden;*/
|
|
|
}
|
|
|
.floor-list {
|
|
|
background-color: #E5E7EA;
|
|
|
- min-width: 75%;
|
|
|
+ /*min-width: 75%;*/
|
|
|
min-height: 500px;
|
|
|
}
|
|
|
.floor-item {
|
|
@@ -456,4 +468,14 @@
|
|
|
.bg-purple-3 {
|
|
|
background: #e5e9f2;
|
|
|
}
|
|
|
+ /deep/ .el-scrollbar__wrap {
|
|
|
+ overflow-x: hidden;
|
|
|
+ overflow-y: visible;
|
|
|
+ padding-bottom: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-scrollbar{
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
</style>
|