From 23f47e6e1e2b96632b048a1119484120e1bc8373 Mon Sep 17 00:00:00 2001 From: wangjiahao <1522128093@qq.com> Date: Wed, 14 Dec 2022 16:31:32 +0800 Subject: [PATCH] =?UTF-8?q?feat(=E4=BB=AA=E8=A1=A8=E6=9D=BF):=20=E4=BB=AA?= =?UTF-8?q?=E8=A1=A8=E6=9D=BF=E6=A0=B7=E5=BC=8F=E5=8F=8A=E4=B8=BB=E9=A2=98?= =?UTF-8?q?=E8=AE=BE=E7=BD=AE=E6=94=AF=E6=8C=81=E8=A7=86=E5=9B=BE=E8=83=8C?= =?UTF-8?q?=E6=99=AF=E5=9B=BE=E7=89=87=E8=AE=BE=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/components/canvas/utils/utils.js | 13 +- frontend/src/lang/en.js | 3 + frontend/src/lang/tw.js | 5 +- frontend/src/lang/zh.js | 5 +- .../background/BackgroundItemOverall.vue | 148 +++++++ .../views/background/BackgroundOverall.vue | 389 ++++++++++++++++++ frontend/src/views/panel/panel.js | 4 +- .../src/views/panel/subjectSetting/index.vue | 22 +- 8 files changed, 575 insertions(+), 14 deletions(-) create mode 100644 frontend/src/views/background/BackgroundItemOverall.vue create mode 100644 frontend/src/views/background/BackgroundOverall.vue diff --git a/frontend/src/components/canvas/utils/utils.js b/frontend/src/components/canvas/utils/utils.js index b02e2dd98a..575232c7ff 100644 --- a/frontend/src/components/canvas/utils/utils.js +++ b/frontend/src/components/canvas/utils/utils.js @@ -1,5 +1,6 @@ import { BASE_MOBILE_STYLE, + COMMON_BACKGROUND, COMMON_BACKGROUND_NONE, HYPERLINKS } from '@/components/canvas/customComponent/component-list' @@ -86,7 +87,17 @@ export function panelDataPrepare(componentData, componentStyle, callback) { componentStyle.chartInfo.tabStyle = (componentStyle.chartInfo.tabStyle || deepCopy(TAB_COMMON_STYLE)) componentStyle.themeId = (componentStyle.themeId || 'NO_THEME') componentStyle.panel.themeColor = (componentStyle.panel.themeColor || 'light') - componentStyle.panel.mobileSetting = (componentStyle.panel.mobileSetting || MOBILE_SETTING) + componentStyle.panel.mobileSetting = (componentStyle.panel.mobileSetting || deepCopy(MOBILE_SETTING)) + + // 主题增加组件背景设置 + if (componentStyle.chartCommonStyle) { + componentStyle.chartCommonStyle.enable = componentStyle.chartCommonStyle.enable || false + componentStyle.chartCommonStyle.backgroundType = componentStyle.chartCommonStyle.backgroundType || 'innerImage' + componentStyle.chartCommonStyle.innerImage = componentStyle.chartCommonStyle.innerImage || 'board/blue_1.svg' + componentStyle.chartCommonStyle.outerImage = componentStyle.chartCommonStyle.outerImage || null + } else { + componentStyle.chartCommonStyle = deepCopy(COMMON_BACKGROUND) + } componentData.forEach((item, index) => { if (item.component && item.component === 'de-date') { const widget = ApplicationContext.getService(item.serviceName) diff --git a/frontend/src/lang/en.js b/frontend/src/lang/en.js index 99a456eb33..87d06eff45 100644 --- a/frontend/src/lang/en.js +++ b/frontend/src/lang/en.js @@ -1932,6 +1932,9 @@ export default { back_parent: 'Back to previous' }, panel: { + view_style: 'View Style', + view_color_setting: 'View Color Setting', + border_color_setting: 'Border Color', unpublished_tips: 'After unpublishing, the panel cannot be viewed. Are you sure you want to cancel publishing? ', position_adjust_component: 'Position adjust', active_font_size: 'Selected font size', diff --git a/frontend/src/lang/tw.js b/frontend/src/lang/tw.js index 145f14c5a0..9e6602a4a7 100644 --- a/frontend/src/lang/tw.js +++ b/frontend/src/lang/tw.js @@ -1926,6 +1926,9 @@ export default { back_parent: '返回上一級' }, panel: { + view_style: '視圖樣式', + view_color_setting: '視圖配色', + border_color_setting: '邊框配色', unpublished_tips: '取消發布後，該儀表板不能被查看。確定要取消發布？', position_adjust_component: '位置調整', active_font_size: '选中字體大小', @@ -2258,7 +2261,7 @@ export default { show_title: '標題', default_settings: '默認值設置', choose_background: '選擇組件背景', - choose_background_tips: '組件自有的背景設置會覆蓋當前設置', + choose_background_tips: '組件自有背景會覆蓋當前設置', setting_background: '設置背景', setting_jump: '跳轉設置', select_view: '請選擇視圖...', diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js index 121cc9d39e..9a0916c9ae 100644 --- a/frontend/src/lang/zh.js +++ b/frontend/src/lang/zh.js @@ -1926,6 +1926,9 @@ export default { back_parent: '返回上一级' }, panel: { + view_style: '视图样式', + view_color_setting: '视图配色', + border_color_setting: '边框配色', unpublished_tips: '取消发布后，该仪表板不能被查看。确定要取消发布？', position_adjust_component: '位置调整', active_font_size: '选中字体大小', @@ -2258,7 +2261,7 @@ export default { show_title: '标题', default_settings: '默认值设置', choose_background: '选择组件背景', - choose_background_tips: '组件自有的背景设置会覆盖当前设置', + choose_background_tips: '组件自有背景会覆盖当前设置', setting_background: '设置背景', setting_jump: '跳转设置', select_view: '请选择视图...', diff --git a/frontend/src/views/background/BackgroundItemOverall.vue b/frontend/src/views/background/BackgroundItemOverall.vue new file mode 100644 index 0000000000..4c1a14c598 --- /dev/null +++ b/frontend/src/views/background/BackgroundItemOverall.vue @@ -0,0 +1,148 @@ + + + + + diff --git a/frontend/src/views/background/BackgroundOverall.vue b/frontend/src/views/background/BackgroundOverall.vue new file mode 100644 index 0000000000..d3a9d706ec --- /dev/null +++ b/frontend/src/views/background/BackgroundOverall.vue @@ -0,0 +1,389 @@ + + + + + diff --git a/frontend/src/views/panel/panel.js b/frontend/src/views/panel/panel.js index f4cf0e7bc8..d9d4c94fff 100644 --- a/frontend/src/views/panel/panel.js +++ b/frontend/src/views/panel/panel.js @@ -1,7 +1,7 @@ // eslint-disable-next-line no-unused-vars import { DEFAULT_COLOR_CASE, DEFAULT_TITLE_STYLE } from '@/views/chart/chart/chart' import { deepCopy } from '@/components/canvas/utils/utils' -import { COMMON_BACKGROUND_BASE } from '@/components/canvas/customComponent/component-list' +import { COMMON_BACKGROUND } from '@/components/canvas/customComponent/component-list' export const TAB_COMMON_STYLE = { headFontColor: '#000000', @@ -50,7 +50,7 @@ export const DEFAULT_PANEL_STYLE = { export const PANEL_CHART_INFO = { chartTitle: DEFAULT_TITLE_STYLE, chartColor: DEFAULT_COLOR_CASE, - chartCommonStyle: COMMON_BACKGROUND_BASE, + chartCommonStyle: COMMON_BACKGROUND, filterStyle: FILTER_COMMON_STYLE, tabStyle: TAB_COMMON_STYLE } diff --git a/frontend/src/views/panel/subjectSetting/index.vue b/frontend/src/views/panel/subjectSetting/index.vue index a34dc1606e..fc3ca2e4ff 100644 --- a/frontend/src/views/panel/subjectSetting/index.vue +++ b/frontend/src/views/panel/subjectSetting/index.vue @@ -3,7 +3,7 @@
{{ $t('panel.dashboard_theme') }}
-
+
- + - + - + - + - + - +
@@ -75,9 +75,13 @@ import ViewTitle from '@/views/panel/subjectSetting/panelStyle/ViewTitle' import ComponentStyle from '@/views/panel/subjectSetting/panelStyle/ComponentStyle' import { adaptCurThemeCommonStyleAll } from '@/components/canvas/utils/style' import FilterStyleSelector from '@/views/panel/subjectSetting/panelStyle/FilterStyleSelector' +import Background from '@/views/background' +import BackgroundOverall from '@/views/background/BackgroundOverall' export default { components: { + BackgroundOverall, + Background, FilterStyleSelector, ComponentStyle, ViewTitle,