[SSE] Add sort settings for slicer to the right menu

This commit is contained in:
Julia Radzhabova 2020-05-28 19:01:50 +03:00
parent 33557ba72d
commit bb7c716a38
4 changed files with 186 additions and 7 deletions

View file

@ -80,6 +80,46 @@
<div class="separator horizontal"></div>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<label class="header"><%= scope.strSorting %></label>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div id="slicer-radio-asc"></div>
</td>
</tr>
<tr>
<td class="padding-large" colspan=2>
<div id="slicer-radio-desc"></div>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div id="slicer-check-hide-nodata"></div>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div id="slicer-check-indicate-nodata"></div>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div id="slicer-check-show-nodata-last"></div>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div id="slicer-check-show-deleted"></div>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div class="separator horizontal"></div>
</td>
</tr>
<tr>
<td align="center" colspan=2>
<label class="link" id="slicer-advanced-link"><%= scope.textAdvanced %></label>

View file

@ -29,10 +29,6 @@
<label class="input-label"><%= scope.strColumns %></label>
<div id="sliceradv-spin-columns"></div>
</div>
<!-- <div style="display: inline-block; margin-right: 5px;"> -->
<!-- <label class="input-label"><%= scope.strWidth %></label> -->
<!-- <div id="sliceradv-spin-col-width"></div> -->
<!-- </div> -->
<div style="display: inline-block;">
<label class="input-label"><%= scope.strHeight %></label>
<div id="sliceradv-spin-col-height"></div>

View file

@ -76,7 +76,11 @@ define([
ColHeight: 0,
PosVert: 0,
PosHor: 0,
PosLocked: false
PosLocked: false,
SortOrder: Asc.ST_tabularSlicerCacheSortOrder.Ascending,
IndNoData: false,
ShowNoData: false,
HideNoData: false
};
this.spinners = [];
this.lockedControls = [];
@ -253,6 +257,95 @@ define([
this.spnColHeight.on('inputleave', function(){ Common.NotificationCenter.trigger('edit:complete', me);});
this.numCols.on('inputleave', function(){ Common.NotificationCenter.trigger('edit:complete', me);});
// Sorting & Filtering
this.radioAsc = new Common.UI.RadioBox({
el: $('#slicer-radio-asc'),
name: 'asc-radio-sliceradv-sort',
labelText: this.textAsc + ' (' + this.textAZ + ')',
checked: true
});
this.radioAsc.on('change', _.bind(function(field, newValue, eOpts) {
if (newValue && this.api) {
if (this._originalProps) {
this._originalProps.asc_getSlicerProperties().asc_setSortOrder(Asc.ST_tabularSlicerCacheSortOrder.Ascending);
this.api.asc_setGraphicObjectProps(this._originalProps);
}
}
}, this));
this.lockedControls.push(this.radioAsc);
this.radioDesc = new Common.UI.RadioBox({
el: $('#slicer-radio-desc'),
name: 'asc-radio-sliceradv-sort',
labelText: this.textDesc + ' (' + this.textZA + ')',
checked: false
});
this.radioDesc.on('change', _.bind(function(field, newValue, eOpts) {
if (newValue && this.api) {
if (this._originalProps) {
this._originalProps.asc_getSlicerProperties().asc_setSortOrder(Asc.ST_tabularSlicerCacheSortOrder.Descending);
this.api.asc_setGraphicObjectProps(this._originalProps);
}
}
}, this));
this.lockedControls.push(this.radioDesc);
this.chHideNoData = new Common.UI.CheckBox({
el: $('#slicer-check-hide-nodata'),
labelText: this.strHideNoData
});
this.chHideNoData.on('change', _.bind(function(field, newValue, oldValue, eOpts){
var checked = (field.getValue()=='checked');
this.chIndNoData.setDisabled(checked);
this.chShowNoData.setDisabled(checked || (this.chIndNoData.getValue()!='checked'));
this.chShowDel.setDisabled(checked);
if (this._originalProps && this.api) {
this._originalProps.asc_getSlicerProperties().asc_setHideItemsWithNoData(checked);
this.api.asc_setGraphicObjectProps(this._originalProps);
}
}, this));
this.lockedControls.push(this.chHideNoData);
this.chIndNoData = new Common.UI.CheckBox({
el: $('#slicer-check-indicate-nodata'),
labelText: this.strIndNoData
});
this.chIndNoData.on('change', _.bind(function(field, newValue, oldValue, eOpts){
var checked = (field.getValue()=='checked');
this.chShowNoData.setDisabled(!checked);
if (this._originalProps && this.api) {
this._originalProps.asc_getSlicerProperties().asc_setIndicateItemsWithNoData(checked);
this.api.asc_setGraphicObjectProps(this._originalProps);
}
}, this));
this.lockedControls.push(this.chIndNoData);
this.chShowNoData = new Common.UI.CheckBox({
el: $('#slicer-check-show-nodata-last'),
disabled: true,
labelText: this.strShowNoData
});
this.chShowNoData.on('change', _.bind(function(field, newValue, oldValue, eOpts){
if (this._originalProps && this.api) {
this._originalProps.asc_getSlicerProperties().asc_setShowItemsWithNoDataLast(field.getValue()=='checked');
this.api.asc_setGraphicObjectProps(this._originalProps);
}
}, this));
this.lockedControls.push(this.chShowNoData);
this.chShowDel = new Common.UI.CheckBox({
el: $('#slicer-check-show-deleted'),
labelText: this.strShowDel
});
this.chShowDel.on('change', _.bind(function(field, newValue, oldValue, eOpts){
// if (this._originalProps && this.api) {
// this._originalProps.asc_getSlicerProperties().asc_setIndicateItemsWithNoData(field.getValue()=='checked');
// this.api.asc_setGraphicObjectProps(this._originalProps);
// }
}, this));
this.lockedControls.push(this.chShowDel);
$(this.el).on('click', '#slicer-advanced-link', _.bind(this.openAdvancedSettings, this));
},
@ -381,6 +474,43 @@ define([
this.chLock.setValue((value !== null && value !== undefined) ? !!value : 'indeterminate', true);
this._state.PosLocked=value;
}
// depends of data type
// this.radioAsc.setCaption(this.textAsc + ' (' + this.textAZ + ')' );
// this.radioDesc.setCaption(this.textDesc + ' (' + this.textZA + ')' );
value = slicerprops.asc_getSortOrder();
if ( this._state.SortOrder!==value ) {
(value==Asc.ST_tabularSlicerCacheSortOrder.Ascending) ? this.radioAsc.setValue(true, true) : this.radioDesc.setValue(true, true);
this._state.SortOrder=value;
}
value = slicerprops.asc_getIndicateItemsWithNoData();
if ( this._state.IndNoData!==value ) {
this.chIndNoData.setValue((value !== null && value !== undefined) ? !!value : 'indeterminate', true);
this._state.IndNoData=value;
}
value = slicerprops.asc_getShowItemsWithNoDataLast();
if ( this._state.ShowNoData!==value ) {
this.chShowNoData.setValue((value !== null && value !== undefined) ? !!value : 'indeterminate', true);
this._state.ShowNoData=value;
}
value = slicerprops.asc_getHideItemsWithNoData();
if ( this._state.HideNoData!==value ) {
this.chHideNoData.setValue((value !== null && value !== undefined) ? !!value : 'indeterminate', true);
this._state.HideNoData=value;
}
this.chIndNoData.setDisabled(value);
this.chShowNoData.setDisabled(value || (this.chIndNoData.getValue()!='checked'));
this.chShowDel.setDisabled(value);
// value = slicerprops.asc_getShowDeleted();
// if ( this._state.ShowDel!==value ) {
// this.chShowDel.setValue((value !== null && value !== undefined) ? !!value : 'indeterminate', true);
// this._state.ShowDel=value;
// }
}
}
},
@ -555,7 +685,20 @@ define([
textButtons: 'Buttons',
textColumns: 'Columns',
textStyle: 'Style',
textLock: 'Disable resizing or moving'
textLock: 'Disable resizing or moving',
strSorting: 'Sorting and filtering',
textAsc: 'Ascending',
textDesc: 'Descending',
textAZ: 'A to Z',
textZA: 'Z to A',
textOldNew: 'oldest to newest',
textNewOld: 'newest to oldest',
textSmallLarge: 'smallest to largest',
textLargeSmall: 'largest to smallest',
strHideNoData: 'Hide items with no data',
strIndNoData: 'Visually indicate items with no data',
strShowNoData: 'Show items with no data last',
strShowDel: 'Show items deleted from the data source'
}, SSE.Views.SlicerSettings || {}));
});

View file

@ -300,7 +300,7 @@ define([ 'text!spreadsheeteditor/main/app/template/SlicerSettingsAdvanced.tem
});
this.chShowNoData.on('change', _.bind(function(field, newValue, oldValue, eOpts){
if (this._changedProps) {
this._changedProps.asc_setHideItemsWithNoData(field.getValue()=='checked');
this._changedProps.asc_setShowItemsWithNoDataLast(field.getValue()=='checked');
}
}, this));