提交 55e39cbf authored 作者: wangjiahao's avatar wangjiahao

feat:增加图片样式组件,统一样式组件设置

上级 627f91b1
// 公共样式
export const commonStyle = {
rotate: 0,
opacity: 1
opacity: 1,
borderStyle: 'solid',
borderWidth: 0,
borderRadius: 0
}
export const commonAttr = {
......@@ -143,6 +146,8 @@ const list = [
type: 'Picture',
propValue: require('@/components/canvas/assets/bg-kj-1.jpg'),
style: {
borderStyle: 'solid',
borderWidth: 0,
width: 600,
height: 300,
borderRadius: ''
......@@ -198,7 +203,7 @@ const list = [
width: 200,
height: 200,
borderStyle: 'solid',
borderWidth: 1,
borderWidth: 0,
borderColor: '#000000',
backgroundColor: '#ffffff',
borderRadius: 0
......
......@@ -162,9 +162,9 @@
<input id="input" ref="files" type="file" accept="image/*" hidden @click="e => {e.target.value = '';}" @change="handleFileChange">
<!--矩形样式组件-->
<RectangleAttr v-if="curComponent&&(curComponent.type==='rect-shape'||curComponent.type==='de-tabs')" :scroll-left="scrollLeft" :scroll-top="scrollTop" />
<TextAttr v-if="curComponent && (curComponent.type==='v-text' || curComponent.type==='de-show-date')" :scroll-left="scrollLeft" :scroll-top="scrollTop" />
<FilterTextAttr v-if="curComponent&&curComponent.type==='custom'&&curComponent.options.attrs.title" :scroll-left="scrollLeft" :scroll-top="scrollTop" />
<!-- <RectangleAttr v-if="curComponent&&(curComponent.type==='rect-shape'||curComponent.type==='de-tabs')" :scroll-left="scrollLeft" :scroll-top="scrollTop" />-->
<TextAttr v-if="showAttr" :scroll-left="scrollLeft" :scroll-top="scrollTop" />
<!-- <FilterTextAttr v-if="curComponent&&curComponent.type==='custom'&&curComponent.options.attrs.title" :scroll-left="scrollLeft" :scroll-top="scrollTop" />-->
<!--复用ChartGroup组件 不做显示-->
<ChartGroup
ref="chartGroup"
......@@ -280,11 +280,33 @@ export default {
scrollLeft: 0,
scrollTop: 0,
timeMachine: null,
dropComponentInfo: null
dropComponentInfo: null,
// 需要展示属性设置的组件类型
showAttrComponent: [
'custom',
'v-text',
'picture-add',
'de-tabs',
'rect-shape',
'de-show-date'
]
}
},
computed: {
showAttr() {
// console.log('showAttr:' + JSON.stringify(this.curComponent))
if (this.curComponent && this.showAttrComponent.includes(this.curComponent.type)) {
// 过滤组件有标题才显示
if (this.curComponent.type === 'custom' && !this.curComponent.options.attrs.title) {
return false
} else {
return true
}
} else {
return false
}
},
customCanvasStyle() {
let style = {}
......@@ -687,6 +709,7 @@ export default {
...commonAttr,
id: generateID(),
component: 'Picture',
type: 'picture-add',
label: '图片',
icon: '',
propValue: fileResult,
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论