优化预览弹窗样式
- 调整预览弹窗的宽度和顶部位置,提升视觉效果。 - 增加预览容器的高度和隐藏溢出内容,改善用户体验。
This commit is contained in:
@@ -537,7 +537,7 @@
|
|||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
|
||||||
<!-- 预览弹窗 -->
|
<!-- 预览弹窗 -->
|
||||||
<el-dialog v-model="previewDialogVisible" title="预览" width="90%" :close-on-click-modal="false" destroy-on-close>
|
<el-dialog v-model="previewDialogVisible" title="预览" width="95%" top="2vh" :close-on-click-modal="false" destroy-on-close>
|
||||||
<div class="preview-container">
|
<div class="preview-container">
|
||||||
<iframe v-if="previewUrl" :src="previewUrl" class="preview-iframe" frameborder="0"></iframe>
|
<iframe v-if="previewUrl" :src="previewUrl" class="preview-iframe" frameborder="0"></iframe>
|
||||||
<el-empty v-else description="无法加载预览内容" />
|
<el-empty v-else description="无法加载预览内容" />
|
||||||
@@ -3423,10 +3423,11 @@ onBeforeUnmount(() => {
|
|||||||
/* 预览弹窗样式 */
|
/* 预览弹窗样式 */
|
||||||
.preview-container {
|
.preview-container {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 70vh;
|
height: 85vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
.preview-iframe {
|
.preview-iframe {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
Reference in New Issue
Block a user