[DE] Update roles list in preview mode button

This commit is contained in:
Julia Radzhabova 2022-04-16 00:04:48 +03:00
parent 43e3a819d0
commit 3c870469f2
5 changed files with 116 additions and 12 deletions

View file

@ -713,6 +713,14 @@ define([
}
},
getChecked: function() {
for (var i=0; i<this.items.length; i++) {
var item = this.items[i];
if (item.isChecked && item.isChecked())
return item;
}
},
clearAll: function() {
_.each(this.items, function(item){
if (item.setChecked)

View file

@ -59,6 +59,7 @@ define([
},
onLaunch: function () {
this._state = {};
this.roles = [];
},
setApi: function (api) {
@ -73,6 +74,7 @@ define([
this.api.asc_registerCallback('asc_onEndAction', _.bind(this.onLongActionEnd, this));
this.api.asc_registerCallback('asc_onError', _.bind(this.onError, this));
this.api.asc_registerCallback('asc_onDownloadUrl', _.bind(this.onDownloadUrl, this));
this.api.asc_registerCallback('asc_onRefreshRolesList', _.bind(this.onRefreshRolesList, this));
// this.api.asc_registerCallback('asc_onShowContentControlsActions',_.bind(this.onShowContentControlsActions, this));
// this.api.asc_registerCallback('asc_onHideContentControlsActions',_.bind(this.onHideContentControlsActions, this));
@ -194,13 +196,14 @@ define([
Common.NotificationCenter.trigger('edit:complete', this.toolbar);
},
onModeClick: function(state) {
onModeClick: function(state, lastRole) {
if (this.api) {
this.disableEditing(state);
this.view && this.view.setPreviewMode(state);
this.view && this.view.setPreviewMode(state); // sent role name - lastRole
this.api.asc_setRestriction(state ? Asc.c_oAscRestrictionType.OnlyForms : Asc.c_oAscRestrictionType.None);
this.api.asc_SetPerformContentControlActionByClick(state);
this.api.asc_SetHighlightRequiredFields(state);
state && (this._state.lastRole = lastRole);
}
Common.NotificationCenter.trigger('edit:complete', this.toolbar);
},
@ -366,6 +369,13 @@ define([
me.view.btnHighlight.currentColor = clr;
}
config.isEdit && config.canFeatureContentControl && config.isFormCreator && me.showCreateFormTip(); // show tip only when create form in docxf
// change to event asc_onRefreshRolesList
me.onRefreshRolesList([
{name: 'employee 1', color: Common.Utils.ThemeColor.getRgbColor('ff0000'), fields: 5},
{name: 'employee 2', color: Common.Utils.ThemeColor.getRgbColor('00ff00'), fields: 1},
{name: 'manager', color: null, fields: 10}
]);
});
},
@ -415,19 +425,22 @@ define([
}
},
onRefreshRolesList: function(roles) {
this.roles = roles;
this.view && this.view.fillRolesMenu(roles, this._state.lastRole);
},
onManagerClick: function() {
var me = this;
(new DE.Views.RolesManagerDlg({
api: me.api,
handler: function(result) {
handler: function(result, settings) {
me.roles = settings;
me.onRefreshRolesList(me.roles);
Common.component.Analytics.trackEvent('ToolBar', 'Roles Manager');
Common.NotificationCenter.trigger('edit:complete', me.toolbar);
},
roles: [
{name: 'employee 1', color: Common.Utils.ThemeColor.getRgbColor('ff0000'), fields: 5},
{name: 'employee 2', color: Common.Utils.ThemeColor.getRgbColor('00ff00'), fields: 1},
{name: 'manager', color: null, fields: 10}
],
roles: me.roles,
props : undefined
})).on('close', function(win){
}).show();

View file

@ -64,6 +64,7 @@ define([
'<div class="separator long forms" style="display: none;"></div>' +
'<div class="group no-group-mask" style="">' +
'<span class="btn-slot text x-huge" id="slot-btn-form-view"></span>' +
'<span class="btn-slot text x-huge" id="slot-btn-form-view-roles"></span>' +
'<span class="btn-slot text x-huge" id="slot-btn-form-prev"></span>' +
'<span class="btn-slot text x-huge" id="slot-btn-form-next"></span>' +
'<span class="btn-slot text x-huge" id="slot-btn-form-clear"></span>' +
@ -95,6 +96,16 @@ define([
this.btnViewForm && this.btnViewForm.on('click', function (b, e) {
me.fireEvent('forms:mode', [b.pressed]);
});
this.btnViewFormRoles && this.btnViewFormRoles.on('click', function (b, e) {
var item = b.menu.getChecked();
me.fireEvent('forms:mode', [b.pressed, item ? item.caption : undefined]);
});
this.btnViewFormRoles.menu.on('item:toggle', _.bind(function (menu, item, state) {
if (!!state) {
me.btnViewFormRoles.toggle(true, true);
me.fireEvent('forms:mode', [true, item.caption]);
}
}, me));
this.btnManager && this.btnManager.on('click', function (b, e) {
me.fireEvent('forms:manager');
});
@ -229,6 +240,25 @@ define([
});
this.paragraphControls.push(this.btnViewForm);
this.btnViewFormRoles = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-sheet-view',
lock: [ _set.previewReviewMode, _set.lostConnect, _set.disableOnStart],
caption: this.capBtnView,
split: true,
menu: new Common.UI.Menu({
cls: 'menu-roles',
maxHeight: 270,
items: []
}),
enableToggle: true,
dataHint: '1',
dataHintDirection: 'bottom',
dataHintOffset: 'small',
visible: false
});
this.paragraphControls.push(this.btnViewFormRoles);
// this.btnHighlight = new Common.UI.ButtonColored({
// cls : 'btn-toolbar',
// iconCls : 'toolbar__icon btn-highlight',
@ -351,6 +381,7 @@ define([
me.btnRadioBox.updateHint(me.tipRadioBox);
me.btnImageField.updateHint(me.tipImageField);
me.btnViewForm.updateHint(me.tipViewForm);
me.btnViewFormRoles.updateHint(me.tipViewForm);
me.btnManager.updateHint(me.tipManager);
}
me.btnClear.updateHint(me.textClearFields);
@ -379,6 +410,7 @@ define([
this.btnRadioBox.render($host.find('#slot-btn-form-radiobox'));
this.btnImageField.render($host.find('#slot-btn-form-image'));
this.btnViewForm.render($host.find('#slot-btn-form-view'));
this.btnViewFormRoles.render($host.find('#slot-btn-form-view-roles'));
this.btnManager.render($host.find('#slot-btn-manager'));
// this.btnHighlight.render($host.find('#slot-form-highlight'));
@ -391,6 +423,35 @@ define([
return this.$el;
},
fillRolesMenu: function(roles, lastRole) {
var checkedIndex = 0,
me = this;
this.btnViewFormRoles.menu.removeAll();
roles && roles.forEach(function(item, index) {
if (item.name===lastRole)
checkedIndex = index;
me.btnViewFormRoles.menu.addItem(new Common.UI.MenuItem({
caption: item.name,
color: item.color ? '#' + Common.Utils.ThemeColor.getHexColor(item.color.get_r(), item.color.get_g(), item.color.get_b()) : 'transparent',
checkable: true,
toggleGroup: 'formtab-view-role',
template: _.template([
'<a id="<%= id %>" tabindex="-1" type="menuitem" class="<%= options.cls %>">',
'<span class="color" style="background: <%= options.color %>;"></span>',
'<%= caption %>',
'</a>'
].join(''))
}));
});
var len = this.btnViewFormRoles.menu.items.length>0;
len && this.btnViewFormRoles.menu.items[checkedIndex].setChecked(true, true);
this.btnViewFormRoles.setVisible(len);
this.btnViewForm.setVisible(!len);
},
show: function () {
Common.UI.BaseView.prototype.show.call(this);
this.fireEvent('show', this);

View file

@ -232,9 +232,12 @@ define([ 'text!documenteditor/main/app/template/RolesManagerDlg.template',
});
if (rec) {
me.rolesList.selectRecord(rec);
me.rolesList.scrollToRecord(rec);
setTimeout(function() {
me.rolesList.scrollToRecord(rec);
}, 50);
}
}
me.updateButtons();
}
}
}).on('close', function() {
@ -244,7 +247,6 @@ define([ 'text!documenteditor/main/app/template/RolesManagerDlg.template',
me.hide();
win.show(xy.left + 65, xy.top + 77);
this.updateButtons();
},
onDeleteRole: function () {
@ -310,7 +312,15 @@ define([ 'text!documenteditor/main/app/template/RolesManagerDlg.template',
},
getSettings: function() {
return this.sort;
var arr = [];
this.rolesList.store.each(function(item, index) {
arr.push({
name: item.get('name'),
color: item.get('color'),
fields: item.get('fields')
});
});
return arr;
},
onPrimary: function() {
@ -318,7 +328,7 @@ define([ 'text!documenteditor/main/app/template/RolesManagerDlg.template',
},
onDlgBtnClick: function(event) {
this.handler && this.handler.call(this, event.currentTarget.attributes['result'].value);
this.handler && this.handler.call(this, event.currentTarget.attributes['result'].value, this.getSettings());
this.close();
},

View file

@ -193,3 +193,15 @@
}
}
}
.dropdown-menu.menu-roles {
li span.color {
display: inline-block;
vertical-align: text-top;
width: 12px;
height: 12px;
margin: 0 8px 0 2px;
border: @scaled-one-px-value-ie solid @border-color-shading-ie;
border: @scaled-one-px-value solid @border-color-shading;
}
}