From 31b76c15740d75a22b6cad08775069b0e85dcb0d Mon Sep 17 00:00:00 2001 From: wangjiahao <1522128093@qq.com> Date: Fri, 10 Dec 2021 17:00:19 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BB=AA=E8=A1=A8=E6=9D=BF=E9=80=89?= =?UTF-8?q?=E9=A1=B9=E5=8D=A1=E7=BB=84=E4=BB=B6=E5=86=85=E8=A7=86=E5=9B=BE?= =?UTF-8?q?=E6=94=AF=E6=8C=81=E6=94=BE=E5=A4=A7=E7=BC=96=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/Editor/ComponentWrapper.vue | 5 +- .../canvas/components/Editor/EditBarView.vue | 90 +++++++++++++++++++ .../canvas/components/Editor/SettingMenu.vue | 2 +- .../canvas/custom-component/UserView.vue | 62 ++++++++----- .../src/components/widget/DeWidget/DeTabs.vue | 20 ++++- 5 files changed, 151 insertions(+), 28 deletions(-) create mode 100644 frontend/src/components/canvas/components/Editor/EditBarView.vue diff --git a/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue b/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue index 96bae648b8..8baba60614 100644 --- a/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue +++ b/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue @@ -5,7 +5,7 @@ @click="handleClick" @mousedown="elementMouseDown" > - + +
+
+ + + + + + +
+ +
+ + + + + diff --git a/frontend/src/components/canvas/components/Editor/SettingMenu.vue b/frontend/src/components/canvas/components/Editor/SettingMenu.vue index 1668d1cf6b..70aea3a8b4 100644 --- a/frontend/src/components/canvas/components/Editor/SettingMenu.vue +++ b/frontend/src/components/canvas/components/Editor/SettingMenu.vue @@ -13,7 +13,7 @@ {{ $t('panel.downComponent') }} {{ $t('panel.linkage_setting') }} {{ $t('panel.add_tab') }} - 跳转设置 + 跳转设置 diff --git a/frontend/src/components/canvas/custom-component/UserView.vue b/frontend/src/components/canvas/custom-component/UserView.vue index f41622b6ea..3818b04ebd 100644 --- a/frontend/src/components/canvas/custom-component/UserView.vue +++ b/frontend/src/components/canvas/custom-component/UserView.vue @@ -8,6 +8,7 @@ 'rect-shape' ]" > +
{{ message }},{{ $t('chart.chart_show_error') }} @@ -67,10 +68,11 @@ import { getToken, getLinkToken } from '@/utils/auth' import DrillPath from '@/views/chart/view/DrillPath' import { areaMapping } from '@/api/map/map' import ChartComponentG2 from '@/views/chart/components/ChartComponentG2' +import EditBarView from '@/components/canvas/components/Editor/EditBarView' export default { name: 'UserView', - components: { ChartComponent, TableNormal, LabelNormal, DrillPath, ChartComponentG2 }, + components: { EditBarView, ChartComponent, TableNormal, LabelNormal, DrillPath, ChartComponentG2 }, props: { element: { type: Object, @@ -93,10 +95,19 @@ export default { required: false, default: false }, - // eslint-disable-next-line vue/require-default-prop componentIndex: { type: Number, required: false + }, + inTab: { + type: Boolean, + required: false, + default: false + }, + isEdit: { + type: Boolean, + require: false, + default: true } }, data() { @@ -120,6 +131,9 @@ export default { } }, computed: { + editBarViewShowFlag() { + return this.active && this.inTab + }, charViewShowFlag() { return this.httpRequest.status && this.chart.type && !this.chart.type.includes('table') && !this.chart.type.includes('text') && this.renderComponent() === 'echarts' }, @@ -566,31 +580,31 @@ export default { display: block !important; } - .rect-shape > i { - right: 5px; - color: gray; - position: absolute; - } + /*.rect-shape > i {*/ + /* right: 5px;*/ + /* color: gray;*/ + /* position: absolute;*/ + /*}*/ - .rect-shape > > > i:hover { - color: red; - } + /*.rect-shape > > > i:hover {*/ + /* color: red;*/ + /*}*/ - .rect-shape:hover > > > .icon-fangda { - z-index: 2; - display: block; - } + /*.rect-shape:hover > > > .icon-fangda {*/ + /* z-index: 2;*/ + /* display: block;*/ + /*}*/ - .rect-shape > > > .icon-fangda { - display: none - } + /*.rect-shape > > > .icon-fangda {*/ + /* display: none*/ + /*}*/ - .rect-shape:hover > > > .icon-shezhi { - z-index: 2; - display: block; - } + /*.rect-shape:hover > > > .icon-shezhi {*/ + /* z-index: 2;*/ + /* display: block;*/ + /*}*/ - .rect-shape > > > .icon-shezhi { - display: none - } + /*.rect-shape > > > .icon-shezhi {*/ + /* display: none*/ + /*}*/ diff --git a/frontend/src/components/widget/DeWidget/DeTabs.vue b/frontend/src/components/widget/DeWidget/DeTabs.vue index fbeea71071..2a5e45ed5a 100644 --- a/frontend/src/components/widget/DeWidget/DeTabs.vue +++ b/frontend/src/components/widget/DeWidget/DeTabs.vue @@ -35,7 +35,7 @@
- +
@@ -94,6 +94,7 @@ import ViewSelect from '@/views/panel/ViewSelect' import { uuid } from 'vue-uuid' import bus from '@/utils/bus' import componentList from '@/components/canvas/custom-component/component-list' +import { mapState } from 'vuex' export default { name: 'DeTabls', @@ -107,6 +108,10 @@ export default { type: Boolean, default: true }, + active: { + type: Boolean, + default: false + }, outStyle: { type: Object, required: false, @@ -129,11 +134,24 @@ export default { tabList: [] } }, + watch: { + curComponent: { + handler(newVal, oldVla) { + console.log(newVal) + }, + deep: true + } + }, created() { bus.$on('add-new-tab', this.addNewTab) this.tabList = this.element.options && this.element.options.tabList this.activeTabName = this.tabList[0].name }, + computed: { + ...mapState([ + 'curComponent' + ]) + }, methods: { beforeHandleCommond(item, param) { return {