code-image-backup-public/lilishop-ui
1
0
Fork 0
mirror of https://gitee.com/beijing_hongye_huicheng/lilishop-ui.git synced 2026-11-12 20:08:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(seller): 优化移动装修编辑器三栏布局与配置面板弹性适配防止溢出

Browse Source
This commit is contained in:
pikachu1995@126.com
2026-11-12 15:11:11 +08:00
parent 8d2adf6732
commit bfcd81ca81
6 changed files with 54 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
seller/src/views/shop/wap/config-panel/PanelAdCube.vue
View File

@@ -33,8 +33,8 @@
<el-input v-model="item.title" maxlength="10" /> <el-input v-model="item.title" maxlength="10" />
</div> </div>
<div class="btn-row"> <div class="btn-row">
<el-button plain type="primary" @click="pickImage(item)">选择照片</el-button> <el-button plain type="primary" size="small" @click="pickImage(item)">选择照片</el-button>
<el-button plain type="primary" @click="pickLink(item)">选择链接</el-button> <el-button plain type="primary" size="small" @click="pickLink(item)">选择链接</el-button>
</div> </div>
<div class="link-view" v-if="item.url && item.url.___type"> <div class="link-view" v-if="item.url && item.url.___type">
已选链接：{{ linkText(item.url) }} 已选链接：{{ linkText(item.url) }}
@@ -312,7 +312,13 @@ export default {
} }
.btn-row { .btn-row {
display: flex; display: flex;
gap: 10px; gap: 8px;
:deep(.el-button),
.el-button {
flex: 1;
min-width: 0;
margin: 0 !important;
}
} }
.link-view { .link-view {
margin-top: 8px; margin-top: 8px;

17
seller/src/views/shop/wap/config-panel/PanelCarousel.vue
View File

@@ -42,8 +42,8 @@
<div class="img-thumb placeholder" v-else>750*350</div> <div class="img-thumb placeholder" v-else>750*350</div>
<div class="img-item-fields"> <div class="img-item-fields">
<div class="btn-row"> <div class="btn-row">
<el-button plain type="primary" @click="pickImage(item)">选择照片</el-button> <el-button plain type="primary" size="small" @click="pickImage(item)">选择照片</el-button>
<el-button plain type="primary" @click="pickLink(item)">选择链接</el-button> <el-button plain type="primary" size="small" @click="pickLink(item)">选择链接</el-button>
</div> </div>
<div class="link-view" v-if="item.url && item.url.___type"> <div class="link-view" v-if="item.url && item.url.___type">
已选链接：{{ linkText(item.url) }} 已选链接：{{ linkText(item.url) }}
@@ -410,8 +410,8 @@ export default {
gap: 10px; gap: 10px;
} }
.img-thumb { .img-thumb {
width: 132px; width: 120px;
height: 62px; height: 60px;
border: 1px dashed #dcdfe6; border: 1px dashed #dcdfe6;
border-radius: 6px; border-radius: 6px;
padding: 3px; padding: 3px;
@@ -445,7 +445,14 @@ export default {
} }
.btn-row { .btn-row {
display: flex; display: flex;
gap: 10px; gap: 8px;
:deep(.el-button),
.el-button {
flex: 1;
min-width: 0;
padding: 0 4px;
margin: 0 !important;
}
} }
.link-view { .link-view {
margin-top: 8px; margin-top: 8px;

12
seller/src/views/shop/wap/config-panel/PanelFlexOne.vue
View File

@@ -23,8 +23,8 @@
</div> </div>
<div class="img-placeholder" v-else>尺寸不限</div> <div class="img-placeholder" v-else>尺寸不限</div>
<div class="btn-row"> <div class="btn-row">
<el-button plain type="primary" @click="pickImage">选择照片</el-button> <el-button plain type="primary" size="small" @click="pickImage">选择照片</el-button>
<el-button plain type="primary" @click="openHotzone">绘制热区</el-button> <el-button plain type="primary" size="small" @click="openHotzone">绘制热区</el-button>
</div> </div>
</div> </div>
</template> </template>
@@ -263,6 +263,12 @@ export default {
} }
.btn-row { .btn-row {
display: flex; display: flex;
gap: 10px; gap: 8px;
:deep(.el-button),
.el-button {
flex: 1;
min-width: 0;
margin: 0 !important;
}
} }
</style> </style>

11
seller/src/views/shop/wap/controls/panel-common.scss
View File

@@ -177,3 +177,14 @@
box-sizing: border-box; box-sizing: border-box;
} }
} }
.btn-row {
display: flex;
gap: 8px;
:deep(.el-button),
.el-button {
flex: 1;
min-width: 0;
margin: 0 !important;
}
}

4
seller/src/views/shop/wap/decorate.scss
View File

@@ -73,8 +73,8 @@
.decorate { .decorate {
padding: 0 20px; padding: 0 20px;
height: calc(100vh - 96px); min-height: 100%;
overflow-y: auto; box-sizing: border-box;
background: #f5f7fa; background: #f5f7fa;
} }

19
seller/src/views/shop/wap/style.scss
View File

@@ -5,8 +5,8 @@
min-width: 0; min-width: 0;
overflow-x: auto; overflow-x: auto;
.model-view-menu { .model-view-menu {
flex: 1.5; flex: 0 0 250px;
min-width: 250px; width: 250px;
overflow-y: auto; overflow-y: auto;
background: #ffffff; background: #ffffff;
border-radius: 8px; border-radius: 8px;
@@ -41,13 +41,16 @@
} }
} }
} }
.model-config {
flex: 2.5;
min-width: 380px;
}
.model-view-content { .model-view-content {
flex: 6; flex: 1;
min-width: 400px; min-width: 520px;
}
.model-config {
flex: 0 0 420px;
width: 420px;
min-width: 420px;
overflow-y: auto;
box-sizing: border-box;
} }
.model-item { .model-item {
line-height: 1.4; line-height: 1.4;