Unverified 提交 c8814f9d authored 作者: fit2cloudrd's avatar fit2cloudrd 提交者: GitHub

fix: 文本搜索组件在预览和编辑时显示不一致 (#1529)

fix: 文本搜索组件在预览和编辑时显示不一致
上级 46c45315
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
:out-style="config.style" :out-style="config.style"
:element="config" :element="config"
:in-screen="inScreen" :in-screen="inScreen"
:edit-mode="'preview'"
:h="config.style.height" :h="config.style.height"
/> />
<component <component
......
...@@ -44,6 +44,7 @@ ...@@ -44,6 +44,7 @@
<script> <script>
import elementResizeDetectorMaker from 'element-resize-detector' import elementResizeDetectorMaker from 'element-resize-detector'
import { mapState } from 'vuex'
export default { export default {
name: 'DeOutWidget', name: 'DeOutWidget',
props: { props: {
...@@ -63,6 +64,11 @@ export default { ...@@ -63,6 +64,11 @@ export default {
h: { h: {
type: Number, type: Number,
default: 50 default: 50
},
editMode: {
type: String,
require: false,
default: 'edit'
} }
}, },
data() { data() {
...@@ -70,26 +76,30 @@ export default { ...@@ -70,26 +76,30 @@ export default {
inputMaxSize: 46, inputMaxSize: 46,
inputLargeSize: 42, inputLargeSize: 42,
inputSmallSize: 38, inputSmallSize: 38,
inputMiniSize: 34, inputMiniSize: 32,
options: null, options: null,
showNumber: false, showNumber: false,
mainClass: '' mainClass: '',
mainHeight: 75,
duHeight: 46
} }
}, },
computed: { computed: {
sizeInfo() { sizeInfo() {
let size let size
if (this.h > this.inputMaxSize) { if (this.duHeight > this.inputMaxSize) {
return size } else if (this.duHeight > this.inputLargeSize) {
} else if (this.h > this.inputLargeSize) {
size = 'medium' size = 'medium'
} else if (this.h > this.inputSmallSize) { } else if (this.duHeight > this.inputSmallSize) {
size = 'small' size = 'small'
} else { } else {
size = 'mini' size = 'mini'
} }
return size return size
} },
...mapState([
'curCanvasScale'
])
}, },
mounted() { mounted() {
this.watchSize() this.watchSize()
...@@ -102,12 +112,16 @@ export default { ...@@ -102,12 +112,16 @@ export default {
watchSize() { watchSize() {
const erd = elementResizeDetectorMaker() const erd = elementResizeDetectorMaker()
erd.listenTo(this.$refs.myContainer, ele => { erd.listenTo(this.$refs.myContainer, ele => {
const deContentContainer = this.$refs.deContentContainer
const height = ele.offsetHeight
this.mainHeight = height
if (!this.element.options.attrs.title) { if (!this.element.options.attrs.title) {
this.duHeight = this.mainHeight
deContentContainer.style.marginLeft = '0px'
return return
} }
const height = ele.offsetHeight
const titleWidth = this.$refs.deTitle.offsetWidth const titleWidth = this.$refs.deTitle.offsetWidth
const deContentContainer = this.$refs.deContentContainer this.duHeight = height - titleWidth
this.$nextTick(() => { this.$nextTick(() => {
let min = this.element.style.fontSize * 2 + 50 let min = this.element.style.fontSize * 2 + 50
if (this.element.component === 'de-number-range') { if (this.element.component === 'de-number-range') {
......
...@@ -67,6 +67,8 @@ ...@@ -67,6 +67,8 @@
</template> </template>
<script> <script>
import {mapState} from "vuex";
export default { export default {
name: 'FilterControl', name: 'FilterControl',
props: { props: {
...@@ -116,7 +118,7 @@ export default { ...@@ -116,7 +118,7 @@ export default {
showTitleChange(value) { showTitleChange(value) {
if (!value) { if (!value) {
this.attrs.title = '' this.attrs.title = ''
// this.componentInfo.style.backgroundColor = '' this.element.style.backgroundColor = ''
} }
this.fillAttrs2Filter() this.fillAttrs2Filter()
}, },
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论