From f265c7d46b4e6cf3108d236ec98b245edb2d5544 Mon Sep 17 00:00:00 2001 From: nikita_bartoshuk Date: Thu, 25 Dec 2025 14:57:28 +0300 Subject: [PATCH] fixes --- .../main/lib/component/ComboDataView.js | 1 + apps/common/main/lib/component/Mixtbar.js | 14 +-- apps/common/main/lib/controller/ChartTab.js | 28 ++++-- apps/common/main/lib/view/ChartTab.js | 90 +++++++++++-------- .../main/resources/less/combo-dataview.less | 23 +++-- .../main/app/controller/Toolbar.js | 11 ++- apps/documenteditor/main/locale/en.json | 1 + apps/pdfeditor/main/app/controller/Toolbar.js | 4 +- apps/pdfeditor/main/locale/en.json | 1 + .../main/app/controller/Toolbar.js | 11 ++- apps/presentationeditor/main/locale/en.json | 1 + 11 files changed, 115 insertions(+), 70 deletions(-) diff --git a/apps/common/main/lib/component/ComboDataView.js b/apps/common/main/lib/component/ComboDataView.js index 5969508170..4ac0ae9b02 100644 --- a/apps/common/main/lib/component/ComboDataView.js +++ b/apps/common/main/lib/component/ComboDataView.js @@ -214,6 +214,7 @@ define([ Common.NotificationCenter.on('more:toggle', _.bind(this.onMoreToggle, this)); Common.NotificationCenter.on('tab:active', _.bind(this.onTabActive, this)); Common.NotificationCenter.on('window:resize', _.bind(this.startCheckSize, this)); + Common.NotificationCenter.on('uitheme:changed', _.bind(this.startCheckSize, this)); me.checkSize(); me.onResize(); me.rendered = true; diff --git a/apps/common/main/lib/component/Mixtbar.js b/apps/common/main/lib/component/Mixtbar.js index 7f97b35a81..a0b3cc72ba 100644 --- a/apps/common/main/lib/component/Mixtbar.js +++ b/apps/common/main/lib/component/Mixtbar.js @@ -157,11 +157,7 @@ define([ Common.NotificationCenter.on('app:repaint', _.bind(function() { this.repaintMoreBtns(); }, this)); - Common.NotificationCenter.on('uitheme:changed', _.bind(function() { - this.clearActiveData(); - this.processPanelVisible(); - this.repaintMoreBtns(); - }, this)); + Common.NotificationCenter.on('uitheme:changed', _.bind(this.onThemeChanged, this)); }, afterRender: function() { @@ -364,7 +360,7 @@ define([ } this.fireEvent('tab:active', [tab]); - Common.NotificationCenter.trigger('tab:active',[tab]); + Common.NotificationCenter.trigger('tab:active', tab); } }, @@ -1053,6 +1049,12 @@ define([ for (var btn in btnsMore) { btnsMore[btn] && btnsMore[btn].isActive() && btnsMore[btn].toggle(false); } + }, + + onThemeChanged: function(e) { + this.clearActiveData(); + this.processPanelVisible(); + this.repaintMoreBtns(); } }; }())); diff --git a/apps/common/main/lib/controller/ChartTab.js b/apps/common/main/lib/controller/ChartTab.js index 7eb0733766..4763de49c9 100644 --- a/apps/common/main/lib/controller/ChartTab.js +++ b/apps/common/main/lib/controller/ChartTab.js @@ -61,7 +61,6 @@ define([ }; this._nRatio = 1; this.spinners = []; - this.chPoints = []; this.lockedControls = []; this._locked = false; this.defColor = {color: '4f81bd', effectId: 24}; @@ -79,7 +78,11 @@ define([ 'charttab:editdata': _.bind(this.setEditData, this), 'charttab:updatedata': _.bind(this.onUpdateData, this), 'charttab:editdataext': _.bind(this.onEditDataExt, this), + 'charttab:selectstyle': _.bind(this.onSelectStyle, this), }, + 'Toolbar': { + 'tab:active': _.bind(this.onActiveTab, this) + } }); }, @@ -211,6 +214,8 @@ define([ this.api.asc_registerCallback('asc_onUpdateChartStyles', _.bind(this._onUpdateChartStyles, this)); this.api.asc_registerCallback('asc_onStartUpdateExternalReference', _.bind(this.onStartUpdateExternalReference, this)); Common.NotificationCenter.on('cells:range', _.bind(this.onCellsRange, this)); + Common.NotificationCenter.on('uitheme:changed', _.bind(this.onThemeChanged, this)); + } return this; }, @@ -431,12 +436,6 @@ define([ var me = this; this._isChartStylesChanged = true; - this.view.chartStyles.on('click', _.bind(this.onSelectStyle, this)); - this.view.chartStyles.openButton.menu.on('show:after', function () { - me.view.chartStyles.menuPicker.scroller.update({alwaysVisibleY: true}); - }); - this.view.lockedControls.push(this.view.chartStyles); - if (styles && styles.length>0){ var stylesStore = this.view.chartStyles.menuPicker.store; if (stylesStore) { @@ -480,6 +479,7 @@ define([ }, setConfig: function(config) { + this.toolbar = config.toolbar; this.view = this.createView('Common.Views.ChartTab', { toolbar: config.toolbar.toolbar }); @@ -551,5 +551,19 @@ define([ this.rangeSelectionMode = (status != Asc.c_oAscSelectionDialogType.None); }, + onActiveTab: function(tab) { + if (tab==='charttab' && this._themeChanged!==false) { + this.onThemeChanged(); + } + }, + + onThemeChanged: function() { + this._themeChanged = !(this.toolbar && this.toolbar.toolbar && this.toolbar.toolbar.isTabActive('charttab')); + if (!this._themeChanged && this.view) { + this.view.onThemeChanged(); + this.toolbar.toolbar.onThemeChanged(); + } + } + }, Common.Controllers.ChartTab || {})); }); \ No newline at end of file diff --git a/apps/common/main/lib/view/ChartTab.js b/apps/common/main/lib/view/ChartTab.js index 946d76c165..64e02d3b32 100644 --- a/apps/common/main/lib/view/ChartTab.js +++ b/apps/common/main/lib/view/ChartTab.js @@ -44,28 +44,28 @@ define([ ], function () { 'use strict'; Common.Views.ChartTab = Common.UI.BaseView.extend(_.extend((function(){ - var template = '
' + + var template = '
' + '
' + - '' + + '' + '
' + '
' + '
' + - '' + + '' + '
' + '
' + '' + '' + '
' + '
' + - '
' + + '
' + '
' + '
' + '
' + '
' + - '' + + '' + '
' + '
' + - '' + + '' + '
' + '
' + '
' + @@ -79,30 +79,30 @@ define([ ) + '
' + '
' + - '' + + '' + '
' + '
' + - '' + + '' + '
' + '
' + '
' + '
' + - '
' + + '
' + '
' + '
' + - '
' + + '
' + '
' + '
' + '
' + '
' + - '' + + '' + '
' + '
' + '
' + '
' + '
' + '
' + - '' + + '' + '
' + '
'; function setEvents() { @@ -143,6 +143,9 @@ define([ me.btnUpdateData.on('click', function (btn, e) { me.fireEvent('charttab:updatedata'); }); + me.chartStyles.on('click', function (combo, record) { + me.fireEvent('charttab:selectstyle', [combo, record]); + }) } return { initialize: function (options) { @@ -616,10 +619,13 @@ define([ this.chartStyles = new Common.UI.ComboDataView({ cls : 'combo-chart-template', - style : 'min-width: 90px; max-width: 496px;', + style : 'min-width: 90px; width: 438; max-width: 438px;', enableKeyEvents : true, + delayRenderTips : true, itemWidth : 50, itemHeight : 50, + minMenuColumn : 4, + maxMenuColumn : 7, menuMaxHeight : 300, groups : new Common.UI.DataViewGroupStore(), autoWidth : true, @@ -628,11 +634,11 @@ define([ beforeOpenHandler: function(e) { var cmp = this, menu = cmp.openButton.menu, - minMenuColumn = 4; + minMenuColumn = cmp.options.minMenuColumn; if (menu.cmpEl) { var itemEl = $(cmp.cmpEl.find('.dataview.inner .style').get(0)).parent(); - var itemMargin = 8; + var itemMargin = parseFloat(itemEl.css('margin-left')) + parseFloat(itemEl.css('margin-right')); var itemWidth = itemEl.is(':visible') ? parseFloat(itemEl.css('width')) : (cmp.itemWidth + parseFloat(itemEl.css('padding-left')) + parseFloat(itemEl.css('padding-right')) + parseFloat(itemEl.css('border-left-width')) + parseFloat(itemEl.css('border-right-width'))); @@ -642,10 +648,10 @@ define([ columnCount = columnCount < minCount ? minCount : columnCount; menu.menuAlignEl = cmp.cmpEl; menu.menuAlign = 'tl-tl'; - var menuWidth = columnCount * (itemMargin + itemWidth) + 16, // for scroller + var menuWidth = columnCount * (itemMargin + itemWidth) + 14, // for scroller buttonOffsetLeft = Common.Utils.getOffset(cmp.openButton.$el).left; if (menuWidth>Common.Utils.innerWidth()) - menuWidth = Math.max(Math.floor((Common.Utils.innerWidth()-16)/(itemMargin + itemWidth)), 2) * (itemMargin + itemWidth) + 16; + menuWidth = Math.max(Math.floor((Common.Utils.innerWidth()-14)/(itemMargin + itemWidth)), 2) * (itemMargin + itemWidth) + 14; var offset = cmp.cmpEl.width() - cmp.openButton.$el.width() - Math.min(menuWidth, buttonOffsetLeft); if (Common.UI.isRTL()) { offset = cmp.openButton.$el.width() + parseFloat($(cmp.$el.find('.combo-dataview').get(0)).css('padding-left')); @@ -662,6 +668,9 @@ define([ dataHintDirection: 'bottom', dataHintOffset: '-16, 0' }); + this.chartStyles.openButton.menu.on('show:after', function () { + me.chartStyles.menuPicker.scroller.update({alwaysVisibleY: true}); + }); this.lockedControls.push(this.chartStyles); this.btnChartType = new Common.UI.Button({ @@ -766,11 +775,6 @@ define([ Common.NotificationCenter.on('app:ready', this.onAppReady.bind(this)); }, - onCheckStyleChange: function(type, stateName, field, newValue, oldValue, eOpts) { - var me = this; - me.fireEvent('tabledesigntab:stylechange', [type, stateName, newValue]); - }, - render: function (el) { if ( el ) el.html( this.getPanel() ); return this; @@ -785,19 +789,19 @@ define([ Common.Utils.injectComponent($host.findById(id), cmp); }; - _injectComponent('#id-chart-spin-width1', this.spnWidth); - _injectComponent('#id-chart-spin-height1', this.spnHeight); - this.btnChartElements && this.btnChartElements.render($host.find('#slot-btn-chart-elements1')); - this.btnEditData && this.btnEditData.render($host.find('#slot-btn-edit-data1')); + _injectComponent('#id-chart-spin-width', this.spnWidth); + _injectComponent('#id-chart-spin-height', this.spnHeight); + this.btnChartElements && this.btnChartElements.render($host.find('#slot-btn-chart-elements')); + this.btnEditData && this.btnEditData.render($host.find('#slot-btn-edit-data')); this.btnEditDataExt && this.btnEditDataExt.render($host.find('#slot-btn-edit-data-ext')); this.btnUpdateData && this.btnUpdateData.render($host.find('#slot-btn-update-data')); - this.chartStyles.render(this.$el.find('#slot-field-chart-styles1')); - this.btnChartType && this.btnChartType.render($host.find('#slot-btn-chart-type1')); - this.btnAdvancedSettings && this.btnAdvancedSettings.render($host.find('#slot-btn-chart-advanced-settings1')); - this.lblWidth && this.lblWidth.render($host.find('#slot-lbl-width1')); - this.lblHeight && this.lblHeight.render($host.find('#slot-lbl-height1')); - this.chRatio && this.chRatio.render($host.find('#slot-chk-ratio1')); - this.btn3DSettings && this.btn3DSettings.render($host.find('#slot-btn-chart-3d-settings1')); + this.chartStyles && this.chartStyles.render(this.$el.find('#slot-field-chart-styles')); + this.btnChartType && this.btnChartType.render($host.find('#slot-btn-chart-type')); + this.btnAdvancedSettings && this.btnAdvancedSettings.render($host.find('#slot-btn-chart-advanced-settings')); + this.lblWidth && this.lblWidth.render($host.find('#slot-lbl-width')); + this.lblHeight && this.lblHeight.render($host.find('#slot-lbl-height')); + this.chRatio && this.chRatio.render($host.find('#slot-chk-ratio')); + this.btn3DSettings && this.btn3DSettings.render($host.find('#slot-btn-chart-3d-settings')); return this.$el; }, @@ -808,13 +812,13 @@ define([ this.btnChartType.setMenu( new Common.UI.Menu({ style: 'width: 364px;padding-top: 12px;', items: [ - {template: _.template('')} + {template: _.template('')} ] })); var onShowBefore = function(menu) { var picker = new Common.UI.DataView({ - el: $('#id-chart-menu-insertchart1'), + el: $('#id-chart-menu-insertchart'), parentMenu: menu, outerMenu: {menu: menu, index:0}, showLast: false, @@ -863,6 +867,22 @@ define([ } }, this); }, + + onThemeChanged: function() { + var cmp = this.chartStyles; + if (cmp && cmp.cmpEl) { + var itemEl = $(cmp.cmpEl.find('.dataview.inner .style').get(0)).parent(), + fieldpicker = cmp.cmpEl.find('.field-picker'), + itemMargin = parseFloat(itemEl.css('margin-left')) + parseFloat(itemEl.css('margin-right')), + itemWidth = itemEl.is(':visible') ? parseFloat(itemEl.css('width')) : + (cmp.itemWidth + parseFloat(itemEl.css('padding-left')) + parseFloat(itemEl.css('padding-right')) + + parseFloat(itemEl.css('border-left-width')) + parseFloat(itemEl.css('border-right-width'))), + maxwidth = (itemWidth + itemMargin) * cmp.options.maxMenuColumn + parseFloat(fieldpicker.css('padding-right')) + + parseFloat(fieldpicker.css('padding-left')) + cmp.openButton.$el.width(); + cmp.cmpEl.css('max-width', maxwidth + 'px'); + cmp.startCheckSize(); + } + }, } }()), Common.Views.ChartTab || {})); }); \ No newline at end of file diff --git a/apps/common/main/resources/less/combo-dataview.less b/apps/common/main/resources/less/combo-dataview.less index cd4c2fa92b..9da66268a7 100644 --- a/apps/common/main/resources/less/combo-dataview.less +++ b/apps/common/main/resources/less/combo-dataview.less @@ -444,27 +444,34 @@ .combo-chart-template { .combo-template(62px); + top: -4px; position: absolute; + .more-container & { position: static; } + .view .dataview, .dropdown-menu { padding: 1px; } + .dataview.inner { padding: 1px 14px 1px 0px; + + .rtl & { + padding: 1px 0px 1px 14px; + } } + .dropdown-menu { padding: 0px 0px 5px 0px; - margin-left: 2px; - .dataview { - .group-description { - padding: 3px 0 3px 10px; - .font-weight-bold(); - .rtl & { - padding: 3px 10px 3px 0; - } + + .dataview.inner { + padding: 1px 12px 1px 0px; + + .rtl & { + padding: 1px 0px 1px 12px; } } } diff --git a/apps/documenteditor/main/app/controller/Toolbar.js b/apps/documenteditor/main/app/controller/Toolbar.js index cccd5afb89..ccf777192d 100644 --- a/apps/documenteditor/main/app/controller/Toolbar.js +++ b/apps/documenteditor/main/app/controller/Toolbar.js @@ -935,17 +935,16 @@ define([ this.toolbar.lockToolbar(Common.enumLock.cantAddImagePara, in_para && !can_add_image, {array: [toolbar.btnInsertTextArt]}); if (in_chart !== this._state.in_chart) { - toolbar.btnInsertChart.updateHint(in_chart ? toolbar.tipChangeChart : toolbar.tipInsertChart); - this._state.in_chart = in_chart; - } + toolbar.btnInsertChart.updateHint( + in_chart ? toolbar.tipChangeChart : toolbar.tipInsertChart + ); - if (this._state.inchart !== in_chart) { - if ( !in_chart && this.toolbar.isTabActive('charttab') ) + if (!in_chart && this.toolbar.isTabActive('charttab')) this.toolbar.setTab('home'); this.toolbar.setVisible('charttab', !!in_chart); if (in_chart && this._state.showChartTab) this.toolbar.setTab('charttab'); - this._state.inchart = in_chart; + this._state.in_chart = in_chart; } var need_disable = paragraph_locked || header_locked || in_equation || control_plain || rich_del_lock || plain_del_lock || content_locked || in_para && !can_add_image; diff --git a/apps/documenteditor/main/locale/en.json b/apps/documenteditor/main/locale/en.json index b63c2b0795..08611542ca 100644 --- a/apps/documenteditor/main/locale/en.json +++ b/apps/documenteditor/main/locale/en.json @@ -1313,6 +1313,7 @@ "Common.Views.ChartTab.menuCapEditLinks": "Edit links", "Common.Views.ChartTab.menuCapOpen": "Open", "Common.Controllers.ChartTab.menuCapOpen": "Open", + "Common.Controllers.ChartTab.textStyle": "Style", "Common.Views.Charts3DDlg.txtXRotation": "X-rotation", "Common.Views.Charts3DDlg.txtYRotation": "Y-rotation", "Common.Views.Charts3DDlg.txtPerspective": "Perspective", diff --git a/apps/pdfeditor/main/app/controller/Toolbar.js b/apps/pdfeditor/main/app/controller/Toolbar.js index 4a70439b36..057a2ab0fb 100644 --- a/apps/pdfeditor/main/app/controller/Toolbar.js +++ b/apps/pdfeditor/main/app/controller/Toolbar.js @@ -663,13 +663,13 @@ define([ } } - if (this._state.inchart !== in_chart) { + if (this._state.in_chart !== in_chart) { if ( !in_chart && this.toolbar.isTabActive('charttab') ) this.toolbar.setTab('home'); this.toolbar.setVisible('charttab', !!in_chart); if (in_chart && this._state.showChartTab) this.toolbar.setTab('charttab'); - this._state.inchart = in_chart; + this._state.in_chart = in_chart; } if (this._state.prcontrolsdisable !== paragraph_locked) { diff --git a/apps/pdfeditor/main/locale/en.json b/apps/pdfeditor/main/locale/en.json index f7e33d19d8..970e8b7434 100644 --- a/apps/pdfeditor/main/locale/en.json +++ b/apps/pdfeditor/main/locale/en.json @@ -965,6 +965,7 @@ "Common.Views.ChartTab.menuCapEditLinks": "Edit links", "Common.Views.ChartTab.menuCapOpen": "Open", "Common.Controllers.ChartTab.menuCapOpen": "Open", + "Common.Controllers.ChartTab.textStyle": "Style", "Common.Views.Charts3DDlg.txtXRotation": "X-rotation", "Common.Views.Charts3DDlg.txtYRotation": "Y-rotation", "Common.Views.Charts3DDlg.txtPerspective": "Perspective", diff --git a/apps/presentationeditor/main/app/controller/Toolbar.js b/apps/presentationeditor/main/app/controller/Toolbar.js index 5096a8b435..096e402a8e 100644 --- a/apps/presentationeditor/main/app/controller/Toolbar.js +++ b/apps/presentationeditor/main/app/controller/Toolbar.js @@ -905,17 +905,16 @@ define([ } if (in_chart !== this._state.in_chart) { - this.toolbar.btnInsertChart.updateHint(in_chart ? this.toolbar.tipChangeChart : this.toolbar.tipInsertChart); - this._state.in_chart = in_chart; - } + this.toolbar.btnInsertChart.updateHint( + in_chart ? this.toolbar.tipChangeChart : this.toolbar.tipInsertChart + ); - if (this._state.inchart !== in_chart) { - if ( !in_chart && this.toolbar.isTabActive('charttab') ) + if (!in_chart && this.toolbar.isTabActive('charttab')) this.toolbar.setTab('home'); this.toolbar.setVisible('charttab', !!in_chart); if (in_chart && this._state.showChartTab) this.toolbar.setTab('charttab'); - this._state.inchart = in_chart; + this._state.in_chart = in_chart; } this.toolbar.lockToolbar(Common.enumLock.noParagraphObject, !in_para, {array: [me.toolbar.btnLineSpace]}); diff --git a/apps/presentationeditor/main/locale/en.json b/apps/presentationeditor/main/locale/en.json index 69d43c678c..2ae97fd857 100644 --- a/apps/presentationeditor/main/locale/en.json +++ b/apps/presentationeditor/main/locale/en.json @@ -1374,6 +1374,7 @@ "Common.Views.ChartTab.menuCapEditLinks": "Edit links", "Common.Views.ChartTab.menuCapOpen": "Open", "Common.Controllers.ChartTab.menuCapOpen": "Open", + "Common.Controllers.ChartTab.textStyle": "Style", "Common.Views.Charts3DDlg.txtXRotation": "X-rotation", "Common.Views.Charts3DDlg.txtYRotation": "Y-rotation", "Common.Views.Charts3DDlg.txtPerspective": "Perspective",