diff --git a/frontend/src/components/canvas/components/AttrList.vue b/frontend/src/components/canvas/components/AttrList.vue
index 5f7a7cd829..181d359c7e 100644
--- a/frontend/src/components/canvas/components/AttrList.vue
+++ b/frontend/src/components/canvas/components/AttrList.vue
@@ -45,7 +45,7 @@
export default {
data() {
return {
- excludes: ['Picture', 'Group', 'user-view'], // 这些组件不显示内容
+ excludes: ['Picture', 'Group', 'view'], // 这些组件不显示内容
textAlignOptions: [
{
label: this.$t('panel.text_align_left'),
diff --git a/frontend/src/components/canvas/components/AttrListExtend.vue b/frontend/src/components/canvas/components/AttrListExtend.vue
index f2475d2c59..4ec5faa13f 100644
--- a/frontend/src/components/canvas/components/AttrListExtend.vue
+++ b/frontend/src/components/canvas/components/AttrListExtend.vue
@@ -2,7 +2,7 @@
-
+
@@ -34,18 +34,39 @@
-
-
+
+
+
+
+
+
+
@@ -20,4 +20,4 @@ export default {
height: 100%;
overflow: auto;
}
-
\ No newline at end of file
+
diff --git a/frontend/src/components/canvas/custom-component/component-list.js b/frontend/src/components/canvas/custom-component/component-list.js
index 6d30085a98..5be3197741 100644
--- a/frontend/src/components/canvas/custom-component/component-list.js
+++ b/frontend/src/components/canvas/custom-component/component-list.js
@@ -47,18 +47,18 @@ const list = [
id: '10001',
component: 'v-text',
label: '文字',
- propValue: '双击编辑文字',
+ propValue: '双击输入文字',
icon: 'wenben',
type: 'v-text',
style: {
- width: 200,
- height: 22,
- fontSize: 14,
+ width: 300,
+ height: 100,
+ fontSize: 18,
fontWeight: 500,
lineHeight: '',
letterSpacing: 0,
textAlign: '',
- color: ''
+ color: '#000000'
}
},
{
@@ -119,22 +119,15 @@ const list = [
style: {
width: 200,
height: 200,
- fontSize: 14,
- fontWeight: 500,
- lineHeight: '',
- letterSpacing: 0,
- textAlign: 'center',
- color: '',
borderColor: '#000',
borderWidth: 1,
backgroundColor: '',
- borderStyle: 'solid',
- verticalAlign: 'middle'
+ borderStyle: 'solid'
}
},
{
id: '10005',
- component: 'user-view',
+ component: 'view',
label: '用户视图',
propValue: '',
icon: 'juxing',
diff --git a/frontend/src/lang/en.js b/frontend/src/lang/en.js
index de9dcab5d1..3431be2e75 100644
--- a/frontend/src/lang/en.js
+++ b/frontend/src/lang/en.js
@@ -996,7 +996,8 @@ export default {
other_module: 'Other',
content: 'Content',
default_panel_name: 'Default Dashboard Name',
- source_panel_name: 'Source Dashboard Name'
+ source_panel_name: 'Source Dashboard Name',
+ content_style: 'Content Style',
},
plugin: {
local_install: 'Local installation',
diff --git a/frontend/src/lang/tw.js b/frontend/src/lang/tw.js
index eeda4a8ed0..91a27ca0d8 100644
--- a/frontend/src/lang/tw.js
+++ b/frontend/src/lang/tw.js
@@ -996,7 +996,8 @@ export default {
other_module: '其他',
content: '内容',
default_panel_name: '默认仪表板名称',
- source_panel_name: '原仪表板名称'
+ source_panel_name: '原仪表板名称',
+ content_style: '内容样式'
},
plugin: {
local_install: '本地安裝',
diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js
index 3675ede7a0..eb5fbb3894 100644
--- a/frontend/src/lang/zh.js
+++ b/frontend/src/lang/zh.js
@@ -996,7 +996,8 @@ export default {
other_module: '其他',
content: '内容',
default_panel_name: '默认仪表板名称',
- source_panel_name: '原仪表板名称'
+ source_panel_name: '原仪表板名称',
+ content_style: '内容样式'
},
plugin: {
local_install: '本地安装',
diff --git a/frontend/src/styles/index.scss b/frontend/src/styles/index.scss
index 460abb98c6..0239e81b91 100644
--- a/frontend/src/styles/index.scss
+++ b/frontend/src/styles/index.scss
@@ -103,6 +103,24 @@ div:focus {
}
}
+.de-style-dialog {
+ min-width: 500px !important;
+ width: 300px !important;
+
+ .el-dialog__header{
+ // background-color: #f4f4f5;
+ padding: 10px 20px !important;
+
+ .el-dialog__headerbtn {
+ top: 15px !important;
+ }
+ }
+ .el-dialog__body{
+ padding: 1px 15px !important;
+
+ }
+}
+
.preview-dialog {
padding: 0px!important;
.el-dialog--center{
diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue
index 5ded3ed5eb..b36ddb3e20 100644
--- a/frontend/src/views/panel/edit/index.vue
+++ b/frontend/src/views/panel/edit/index.vue
@@ -104,10 +104,10 @@
-
-
- {{ $t('panel.select_component') }}
-
+
+
+
+
@@ -135,6 +135,21 @@
+
+
+
+
+
+ {{ $t('commons.confirm') }}
+
+
+
+
@@ -222,7 +237,8 @@ export default {
width: null,
height: null
},
- beforeDialogValue: []
+ beforeDialogValue: [],
+ styleDialogVisible: false
}
},
@@ -234,7 +250,8 @@ export default {
'curComponent',
'isClickComponent',
'canvasStyleData',
- 'curComponentIndex'
+ 'curComponentIndex',
+ 'componentData'
])
},
@@ -266,7 +283,10 @@ export default {
})
bus.$on('component-dialog-edit', () => {
- this.eidtDialog()
+ this.editDialog()
+ })
+ bus.$on('component-dialog-style', () => {
+ this.styleDialogVisible = true
})
bus.$on('previewFullScreenClose', () => {
@@ -400,7 +420,7 @@ export default {
this.currentFilterCom.id = newComponentId
if (this.currentWidget.filterDialog) {
this.show = false
- this.openFilterDiolog()
+ this.openFilterDialog()
return
}
component = deepCopy(this.currentFilterCom)
@@ -413,6 +433,14 @@ export default {
this.$store.commit('addComponent', { component })
this.$store.commit('recordSnapshot')
this.clearCurrentInfo()
+
+ debugger
+ // 文字组件
+ if (component.type === 'v-text' || component.type === 'rect-shape') {
+ this.$store.commit('setCurComponent', { component: component, index: this.componentData.length })
+ this.styleDialogVisible = true
+ this.show = false
+ }
},
clearCurrentInfo() {
this.currentWidget = null
@@ -440,7 +468,7 @@ export default {
this.$store.commit('hideContextMenu')
}
},
- openFilterDiolog() {
+ openFilterDialog() {
this.beforeDialogValue = []
this.filterVisible = true
},
@@ -463,11 +491,11 @@ export default {
this.currentFilterCom = component
this.$forceUpdate()
},
- eidtDialog() {
+ editDialog() {
const serviceName = this.curComponent.serviceName
this.currentWidget = ApplicationContext.getService(serviceName)
this.currentFilterCom = this.curComponent
- this.openFilterDiolog()
+ this.openFilterDialog()
},
closeLeftPanel() {
this.show = false
@@ -494,6 +522,9 @@ export default {
// console.log(canvasHeight + '--' + canvasWidth)
})
}
+ },
+ closeStyleDialog() {
+ this.styleDialogVisible = false
}
}
}