修复Pad/H5表单布局的预览显示样式问题。

master
vdpAdmin 2022-02-23 12:16:09 +08:00
parent 9811d9389e
commit 50b32fed66
4 changed files with 15 additions and 13 deletions

View File

@ -15,7 +15,7 @@ export default {
data() { data() {
return { return {
designerConfig: { designerConfig: {
resetFormJson: true, resetFormJson: false,
} }
} }
} }

View File

@ -162,6 +162,7 @@ export default {
if ((this.field.type === 'radio') || (this.field.type === 'checkbox') if ((this.field.type === 'radio') || (this.field.type === 'checkbox')
|| (this.field.type === 'select') || (this.field.type === 'cascader')) { || (this.field.type === 'select') || (this.field.type === 'cascader')) {
/* 异步更新option-data之后globalOptionData不能获取到最新值改用provide的getOptionData()方法 */
const newOptionItems = this.getOptionData() const newOptionItems = this.getOptionData()
if (!!newOptionItems && newOptionItems.hasOwnProperty(this.field.options.name)) { if (!!newOptionItems && newOptionItems.hasOwnProperty(this.field.options.name)) {
if (!!keepSelected) { if (!!keepSelected) {

View File

@ -173,7 +173,6 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.container-scroll-bar { .container-scroll-bar {
::v-deep .el-scrollbar__wrap, ::v-deep .el-scrollbar__view { ::v-deep .el-scrollbar__wrap, ::v-deep .el-scrollbar__view {
overflow-x: hidden; overflow-x: hidden;
} }
@ -187,14 +186,6 @@
overflow-y: auto; overflow-y: auto;
.el-form.full-height-width { .el-form.full-height-width {
/*
margin: 0 auto;
width: 420px;
border-radius: 15px;
//border-width: 10px;
box-shadow: 0 0 1px 10px #495060;
*/
height: 100%; height: 100%;
padding: 3px; padding: 3px;
background: #ffffff; background: #ffffff;

View File

@ -45,9 +45,10 @@
<el-dialog :title="i18nt('designer.toolbar.preview')" :visible.sync="showPreviewDialogFlag" v-if="showPreviewDialogFlag" <el-dialog :title="i18nt('designer.toolbar.preview')" :visible.sync="showPreviewDialogFlag" v-if="showPreviewDialogFlag"
:show-close="true" :close-on-click-modal="false" :close-on-press-escape="false" center v-dialog-drag :show-close="true" :close-on-click-modal="false" :close-on-press-escape="false" center v-dialog-drag
:destroy-on-close="true" class="small-padding-dialog" width="75%" :fullscreen="layoutType === 'H5'"> :destroy-on-close="true" class="small-padding-dialog" width="75%"
:fullscreen="(layoutType === 'H5') || (layoutType === 'Pad')">
<div> <div>
<div class="form-render-wrapper" :class="[layoutType === 'H5' ? 'h5-layout' : '']"> <div class="form-render-wrapper" :class="[layoutType === 'H5' ? 'h5-layout' : (layoutType === 'Pad' ? 'pad-layout' : '')]">
<VFormRender ref="preForm" :form-json="formJson" :form-data="testFormData" :preview-state="true" <VFormRender ref="preForm" :form-json="formJson" :form-data="testFormData" :preview-state="true"
:option-data="testOptionData" :option-data="testOptionData"
@appendButtonClick="testOnAppendButtonClick" @buttonClick="testOnButtonClick" @appendButtonClick="testOnAppendButtonClick" @buttonClick="testOnButtonClick"
@ -695,7 +696,7 @@
.form-render-wrapper { .form-render-wrapper {
//height: calc(100vh - 142px); //height: calc(100vh - 142px);
all: revert !important; /* 防止表单继承el-dialog等外部样式未生效原因不明 */ //all: revert !important; /* el-dialog */
} }
.form-render-wrapper.h5-layout { .form-render-wrapper.h5-layout {
@ -707,6 +708,15 @@
height: calc(100vh - 142px); height: calc(100vh - 142px);
} }
.form-render-wrapper.pad-layout {
margin: 0 auto;
width: 960px;
border-radius: 15px;
//border-width: 10px;
box-shadow: 0 0 1px 10px #495060;
height: calc(100vh - 142px);
}
.node-tree-drawer ::v-deep { .node-tree-drawer ::v-deep {
.el-drawer { .el-drawer {
padding: 10px; padding: 10px;