|
|
/**
|
|
|
* grid样式保存窗口
|
|
|
* @description 将用户自己设置的grid样式保存到后台，下次打开界面时就是用户保存的界面状态
|
|
|
*/
|
|
|
define(function(require, exports, module) {
|
|
|
|
|
|
require('./gridstylewindow.css')
|
|
|
var Window = require('../window/window'),
|
|
|
tpl = require('./gridstylewindow.tpl'),
|
|
|
ToolbarAdapter = require('../../../adapter/toolbarAdapter'),
|
|
|
GridAdapter = require('../../../adapter/datagridAdapter'),
|
|
|
editIndex = undefined,
|
|
|
self = null;
|
|
|
|
|
|
function GridStyleWindow(args) {
|
|
|
this.options = {
|
|
|
title: '报表样式设置',
|
|
|
content: tpl,
|
|
|
width: 800,
|
|
|
top: window.scrollY + 100,
|
|
|
height: 600,
|
|
|
modal: true,
|
|
|
closed: true,
|
|
|
closable: true,
|
|
|
draggable: true,
|
|
|
data: null
|
|
|
}
|
|
|
|
|
|
self = this;
|
|
|
this.args = args;
|
|
|
this.id = createGuid();
|
|
|
|
|
|
Window.call(this, this.options);
|
|
|
}
|
|
|
|
|
|
inherits(GridStyleWindow, Window);
|
|
|
|
|
|
GridStyleWindow.prototype.init = function() {
|
|
|
|
|
|
};
|
|
|
|
|
|
GridStyleWindow.prototype.open = function() {
|
|
|
Window.prototype.open.call(this);
|
|
|
};
|
|
|
|
|
|
GridStyleWindow.prototype.customerize = function() {
|
|
|
this.toolContainer = this.getElement('.fdpr-gridstyle-toolbar');
|
|
|
this.gridContainer = this.getElement('.fdpr-gridstyle-main');
|
|
|
this.initToolbar();
|
|
|
this.initGrid();
|
|
|
this.setVkEvent();
|
|
|
};
|
|
|
|
|
|
GridStyleWindow.prototype.setVkEvent = function() {
|
|
|
var panel = self.$grid.datagrid('getPanel');
|
|
|
self.$container.on('focus', 'input.datagrid-editable-input', function(e) {
|
|
|
window.openVK(e.target, '1');
|
|
|
});
|
|
|
panel.on('blur', 'input.datagrid-editable-input', function(e) {
|
|
|
window.closeVK(e);
|
|
|
});
|
|
|
};
|
|
|
|
|
|
GridStyleWindow.prototype.opRouter = function(opcode) {
|
|
|
var self = this;
|
|
|
switch (opcode) {
|
|
|
case 'stylesave':
|
|
|
saveStyleData();
|
|
|
break;
|
|
|
case 'quit':
|
|
|
self.close();
|
|
|
break;
|
|
|
default:
|
|
|
break;
|
|
|
}
|
|
|
};
|
|
|
|
|
|
GridStyleWindow.prototype.initToolbar = function() {
|
|
|
self.tooladp = new ToolbarAdapter({
|
|
|
pageId: self.id,
|
|
|
container: self.toolContainer,
|
|
|
buttons: [
|
|
|
{
|
|
|
"fieldname": "stylesave",
|
|
|
"dispname": "保存",
|
|
|
"icon": "icon-save",
|
|
|
"class": "",
|
|
|
"hint": "保存",
|
|
|
"opcode": "stylesave"
|
|
|
},
|
|
|
{
|
|
|
"fieldname": "quit",
|
|
|
"dispname": "退出",
|
|
|
"icon": "icon-save",
|
|
|
"class": "",
|
|
|
"hint": "退出",
|
|
|
"opcode": "quit"
|
|
|
}
|
|
|
],
|
|
|
menuButtons: [],
|
|
|
actions: {
|
|
|
click: function(opcode) {
|
|
|
self.opRouter(opcode);
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
self.tooladp.init();
|
|
|
};
|
|
|
|
|
|
GridStyleWindow.prototype.initGrid = function() {
|
|
|
var columns = makeGridColumns(),
|
|
|
data = makeGridData();
|
|
|
// var columns = JSON.parse(printColumns);
|
|
|
// self.makeColumnEditor(columns);
|
|
|
self.gridadp = new GridAdapter({
|
|
|
id: self.id,
|
|
|
selfColumn: true,
|
|
|
name: '',
|
|
|
opts: {},
|
|
|
data: {
|
|
|
columns: columns
|
|
|
},
|
|
|
actions: {
|
|
|
// onDblClickCell: onClickCell,
|
|
|
// onBeforeEdit: onBeforeEdit,
|
|
|
// onEndEdit: onEndEdit,
|
|
|
onLoadSuccess: function(){
|
|
|
enabelDnd();
|
|
|
},
|
|
|
onStopDrag: function(row) {
|
|
|
resetRowIndex(row);
|
|
|
},
|
|
|
onSortColumn: function() {
|
|
|
enabelDnd();
|
|
|
},
|
|
|
onAfterCellEdit: function(e, dg, blurObj) {
|
|
|
window.closeVK(e);
|
|
|
if (blurObj.ov == blurObj.nv || blurObj.field != 'dispindex') return;
|
|
|
resetTableSort(dg, blurObj);
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
self.gridadp.makeGridProperties({
|
|
|
height: 430,
|
|
|
showFooter: false,
|
|
|
rownumbers: true,
|
|
|
ctrlSelect: false,
|
|
|
singleSelect: true,
|
|
|
dblclickToEdit: true
|
|
|
});
|
|
|
self.gridadp.init(self.gridContainer);
|
|
|
// self.gridadp.fitColumns();
|
|
|
self.gridadp.loadData(data);
|
|
|
self.$grid = self.gridadp.grid.$grid;
|
|
|
};
|
|
|
|
|
|
function resetTableSort(dg, obj) {
|
|
|
var ov = parseInt(obj.ov);
|
|
|
var nv = parseInt(obj.nv);
|
|
|
var index = obj.index;
|
|
|
var rows = dg.datagrid('getRows');
|
|
|
for (var i = 0; i < rows.length; i++) {
|
|
|
var value = parseInt(rows[i].dispindex) || 0;
|
|
|
if (nv > ov) {
|
|
|
if (value >= ov && value <= nv && i != index) {
|
|
|
rows[i].dispindex = parseInt(rows[i].dispindex) - 1;
|
|
|
}
|
|
|
} else {
|
|
|
if (value >= nv && value <= ov && i != index) {
|
|
|
rows[i].dispindex = parseInt(rows[i].dispindex) + 1;
|
|
|
}
|
|
|
}
|
|
|
// dg.datagrid('refreshRow', i);
|
|
|
}
|
|
|
setTimeout(function() {
|
|
|
dg.datagrid('sort', {
|
|
|
sortName: 'dispindex'
|
|
|
});
|
|
|
}, 100)
|
|
|
}
|
|
|
|
|
|
function enabelDnd() {
|
|
|
self.gridadp.grid.$grid
|
|
|
// .datagrid('enableDnd')
|
|
|
.datagrid('enableCellEditing');
|
|
|
}
|
|
|
|
|
|
function onEndEdit(index, row){
|
|
|
var keys = Object.keys(row);
|
|
|
var width = self.$grid.datagrid('getEditor', {
|
|
|
index: 2,
|
|
|
field: keys[index]
|
|
|
});
|
|
|
var viewable = self.$grid.datagrid('getEditor', {
|
|
|
index: 3,
|
|
|
field: keys[index]
|
|
|
});
|
|
|
if (width) {
|
|
|
row[keys[2]] = width.target.val();
|
|
|
}
|
|
|
if (viewable) {
|
|
|
row[keys[3]] = viewable.target.val();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 重新设置行的显示顺序值
|
|
|
*/
|
|
|
function resetRowIndex(row) {
|
|
|
var grid = self.gridadp.grid.$grid,
|
|
|
// index = grid.datagrid('getRowIndex', row),
|
|
|
rows = grid.datagrid('getRows');
|
|
|
|
|
|
for (var i = 0; i < rows.length; i++) {
|
|
|
var _row = rows[i];
|
|
|
_row.dispindex = i;
|
|
|
grid.datagrid('updateRow', {
|
|
|
index: i,
|
|
|
row: _row
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 制作grid column
|
|
|
*/
|
|
|
function makeGridColumns() {
|
|
|
return [[
|
|
|
{
|
|
|
"sortable": "true",
|
|
|
"field": "title",
|
|
|
"align": "",
|
|
|
"width": "23%",
|
|
|
"rowspan": 1,
|
|
|
"colspan": 1,
|
|
|
"title": "列名",
|
|
|
"deltaWidth": 9,
|
|
|
"boxWidth": 71
|
|
|
},
|
|
|
{
|
|
|
"sortable": "true",
|
|
|
"field": "dispindex",
|
|
|
"align": "center",
|
|
|
"width": "23%",
|
|
|
"rowspan": 1,
|
|
|
"colspan": 1,
|
|
|
"title": "显示顺序",
|
|
|
"deltaWidth": 9,
|
|
|
"boxWidth": 111,
|
|
|
"editor": "text"
|
|
|
},
|
|
|
{
|
|
|
"sortable": "true",
|
|
|
"field": "dispwidth",
|
|
|
"align": "center",
|
|
|
"width": "23%",
|
|
|
"rowspan": 1,
|
|
|
"colspan": 1,
|
|
|
"title": "显示宽度",
|
|
|
"deltaWidth": 9,
|
|
|
"boxWidth": 71,
|
|
|
"editor": "text"
|
|
|
},
|
|
|
{
|
|
|
"sortable": "true",
|
|
|
"field": "viewable",
|
|
|
"align": "center",
|
|
|
"width": "23%",
|
|
|
"rowspan": 1,
|
|
|
"colspan": 1,
|
|
|
"title": "是否可见",
|
|
|
"deltaWidth": 9,
|
|
|
"boxWidth": 71,
|
|
|
"editor": {
|
|
|
type: 'checkbox',
|
|
|
options:{on:'是',off:'否'}
|
|
|
}
|
|
|
}
|
|
|
]];
|
|
|
}
|
|
|
|
|
|
function saveStyleData() {
|
|
|
if (self.$grid.datagrid('getChanges').length == 0) {
|
|
|
return;
|
|
|
}
|
|
|
var rows = self.$grid.datagrid('getRows');
|
|
|
var _rows = JSON.stringify(rows);
|
|
|
_rows = _rows.replace(/"viewable":"是"/g, '"viewable":"1"');
|
|
|
_rows = _rows.replace(/"viewable":"否"/g, '"viewable":"0"');
|
|
|
rows = JSON.parse(_rows);
|
|
|
var params = {
|
|
|
rptId: self.args.dataManager.rptId,
|
|
|
rptFormatId: self.args.dataManager.rptFormatId,
|
|
|
styleList: rows
|
|
|
};
|
|
|
ER.services.privatefmt(params, function (isok, data) {
|
|
|
if (isok) {
|
|
|
ER.messager.tip('保存成功,点击确定后将刷新页面!', function() {
|
|
|
window.location.reload();
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
function makeGridData() {
|
|
|
var columns = self.args.cols,
|
|
|
col = null,
|
|
|
data = [];
|
|
|
for (var i = 0 ; i < columns.length; i++) {
|
|
|
col = columns[i];
|
|
|
data.push({
|
|
|
fieldname: col.fieldName,
|
|
|
title: col.dispName,
|
|
|
dispindex: col.dispIndex,
|
|
|
dispwidth: col.headerWidth,
|
|
|
viewable: col.dispPosition == '3' ? '否' : '是'
|
|
|
});
|
|
|
}
|
|
|
data = _.sortBy(data, 'dispindex');
|
|
|
return data;
|
|
|
}
|
|
|
|
|
|
function onClickCell(index, field){
|
|
|
// if (!self.editStatus) return;
|
|
|
// if (editIndex != index){
|
|
|
if (endEditing()){
|
|
|
self.$grid.datagrid('selectRow', index);
|
|
|
self.$grid.datagrid('beginEdit', index);
|
|
|
var ed = self.$grid.datagrid('getEditor', {index:index,field:field});
|
|
|
if (ed){
|
|
|
($(ed.target).data('textbox') ? $(ed.target).textbox('textbox') : $(ed.target)).focus();
|
|
|
}
|
|
|
editIndex = index;
|
|
|
} else {
|
|
|
setTimeout(function(){
|
|
|
self.$grid.datagrid('selectRow', editIndex);
|
|
|
},0);
|
|
|
}
|
|
|
// }
|
|
|
}
|
|
|
|
|
|
function accept(){
|
|
|
if (endEditing()){
|
|
|
self.$grid.datagrid('acceptChanges');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function endEditing(){
|
|
|
if (editIndex == undefined){return true}
|
|
|
// if (self.$grid.datagrid('validateRow', editIndex)){
|
|
|
self.$grid.datagrid('acceptChanges');
|
|
|
self.$grid.datagrid('endEdit', editIndex);
|
|
|
editIndex = undefined;
|
|
|
console.log('success');
|
|
|
return true;
|
|
|
// } else {
|
|
|
// console.log('failed');
|
|
|
// return false;
|
|
|
// }
|
|
|
}
|
|
|
|
|
|
|
|
|
return GridStyleWindow;
|
|
|
|
|
|
|
|
|
}); |
