168 lines
3.1 KiB
JavaScript
168 lines
3.1 KiB
JavaScript
Ext.define('PageLayoutPanel', {
|
|
extend: 'Ext.panel.Panel',
|
|
alias: 'widget.pageLayoutPanel',
|
|
|
|
layout: {
|
|
type: 'hbox',
|
|
align: 'stretch',
|
|
pack: 'start',
|
|
},
|
|
|
|
getValues: function() {
|
|
let me = this;
|
|
|
|
let values = {};
|
|
|
|
Ext.Array.each(me.query('[isFormField]'), function(field) {
|
|
if (field.isValid()) {
|
|
let data = field.getSubmitData();
|
|
Ext.Object.each(data, function(name, val) {
|
|
values[name] = val;
|
|
});
|
|
}
|
|
});
|
|
|
|
let paper_size = values.paper_size || 'a4';
|
|
|
|
let param = Ext.apply({}, paper_sizes[paper_size]);
|
|
if (param === undefined) {
|
|
throw `unknown paper size ${paper_size}`;
|
|
}
|
|
|
|
param.paper_size = paper_size;
|
|
|
|
Ext.Object.each(values, function(name, val) {
|
|
let parsed = parseFloat(val, 10);
|
|
param[name] = isNaN(parsed) ? val : parsed;
|
|
});
|
|
|
|
return param;
|
|
},
|
|
|
|
controller: {
|
|
xclass: 'Ext.app.ViewController',
|
|
|
|
control: {
|
|
'paperSize': {
|
|
change: function(field, paper_size) {
|
|
let view = this.getView();
|
|
let defaults = paper_sizes[paper_size];
|
|
|
|
let names = [
|
|
'label_width',
|
|
'label_height',
|
|
'margin_left',
|
|
'margin_top',
|
|
'column_spacing',
|
|
'row_spacing',
|
|
];
|
|
for (i = 0; i < names.length; i++) {
|
|
let name = names[i];
|
|
let f = view.down(`field[name=${name}]`);
|
|
let v = defaults[name];
|
|
if (v != undefined) {
|
|
f.setValue(v);
|
|
f.setDisabled(defaults.fixed);
|
|
} else {
|
|
f.setDisabled(false);
|
|
}
|
|
}
|
|
},
|
|
},
|
|
'field': {
|
|
change: function() {
|
|
let view = this.getView();
|
|
let param = view.getValues();
|
|
view.fireEvent("pagechanged", param);
|
|
},
|
|
},
|
|
},
|
|
},
|
|
|
|
items: [
|
|
{
|
|
border: false,
|
|
layout: {
|
|
type: 'vbox',
|
|
align: 'stretch',
|
|
pack: 'start',
|
|
},
|
|
items: [
|
|
{
|
|
xtype: 'paperSize',
|
|
name: 'paper_size',
|
|
value: 'a4',
|
|
fieldLabel: 'Paper Size',
|
|
},
|
|
{
|
|
xtype: 'numberfield',
|
|
name: 'label_width',
|
|
fieldLabel: 'Label width',
|
|
minValue: 70,
|
|
allowBlank: false,
|
|
value: 70,
|
|
},
|
|
{
|
|
xtype: 'numberfield',
|
|
name: 'label_height',
|
|
fieldLabel: 'Label height',
|
|
minValue: 17,
|
|
allowBlank: false,
|
|
value: 17,
|
|
},
|
|
{
|
|
xtype: 'checkbox',
|
|
name: 'label_borders',
|
|
fieldLabel: 'Label borders',
|
|
value: true,
|
|
inputValue: true,
|
|
},
|
|
],
|
|
},
|
|
{
|
|
border: false,
|
|
margin: '0 0 0 10',
|
|
layout: {
|
|
type: 'vbox',
|
|
align: 'stretch',
|
|
pack: 'start',
|
|
},
|
|
items: [
|
|
{
|
|
xtype: 'numberfield',
|
|
name: 'margin_left',
|
|
fieldLabel: 'Left margin',
|
|
minValue: 0,
|
|
allowBlank: false,
|
|
value: 0,
|
|
},
|
|
{
|
|
xtype: 'numberfield',
|
|
name: 'margin_top',
|
|
fieldLabel: 'Top margin',
|
|
minValue: 0,
|
|
allowBlank: false,
|
|
value: 4,
|
|
},
|
|
{
|
|
xtype: 'numberfield',
|
|
name: 'column_spacing',
|
|
fieldLabel: 'Column spacing',
|
|
minValue: 0,
|
|
allowBlank: false,
|
|
value: 0,
|
|
},
|
|
{
|
|
xtype: 'numberfield',
|
|
name: 'row_spacing',
|
|
fieldLabel: 'Row spacing',
|
|
minValue: 0,
|
|
allowBlank: false,
|
|
value: 0,
|
|
},
|
|
],
|
|
},
|
|
],
|
|
|
|
});
|