此代码为完整代码，其中包含定位、使用 Enter 键，来实现 Tab 键。
Ext.define('xxx.recordBook.view.EditGrid', {
extend: 'Ext.form.field.GridField',
xtype: 'xxx',
id: 'xxx',
store: {
type: 'xxx.instrumentdata.editInstrumentData'
},
requires: [
'Ext.grid.selection.SpreadsheetModel',
'Ext.grid.plugin.Clipboard'
],
plugins: [
cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
})
],
overrideInitComponent: function (config) {
delete config.viewConfig;
return config;
},
selModel: {
type: 'spreadsheet',
columnSelect: true,
pruneRemoved: false,
extensible: 'y'
},
disabled: true,
getColumns: function (dataColumns) {
var columns = [{
/* 观测时间 */
text: l('Monitors.InstrumentData.MeasureTime'),
dataIndex: 'measureTime',
xtype: 'datecolumn',
format: l('Format.DateTime'),
width: 200,
editor: {
maxValue: Ext.Date.format(new Date(), 'Y-m-d H:i:s'),
xtype: "datetimefield",
name: 'measureTime',
defaultTime: '00:00:00'
}
}];
if (dataColumns != "") {
columns = columns.concat(dataColumns);
}
columns = columns.concat(
[{
/* 记录日志 */
text: l('Monitors.InstrumentData.Note'),
dataIndex: 'note',
flex: 1,
editor: {
allowBlank: true
}
}]
);
return columns;
},
initComponent: function () {
var me = this;
this.map = new Map();
me.items = me.getColumns('');
me.callParent(arguments);
},
buttons: [{
text: l('PreviousSiteRecordBook'),
handler: 'preSiteRecordBook',
iconCls: 'fa fa-window-close'
},
{
text: l('Save'),
handler: 'saveRecordBook',
iconCls: 'fa fa-save',
},
{
text: l('NextSite'),
handler: 'nextSiteRecordBook',
iconCls: 'fa fa-save',
}
],
init: function (record, data) {
var me = this;
Esms.getInstrumentDataEditColumn(record.instrumentTypeId, function (columns, result) {
me.dataTemplate = JSON.parse(result.instrumentType.dataTemplate);
me.result = result;
try {
me.chartTemplate = JSON.parse(result.template.chartTemplate);
} catch (error) {
} finally {
me.odata = data;
var cols = me.getColumns(columns);
me.setColumns(cols);
var position = {
row: 0,
column: 1
};
var cellEditing = me.plugins[0];
cellEditing.startEditByPosition(position);
}
}, function () { }, true);
//初始化10行 rowEditing 数据露
var measureTime = window.measureTime == undefined ? new Date(new Date().format('yyyy-MM-dd ')) : window.measureTime;
if (me.getStore().data.items.length == 0) {
me.getStore().insert(0, {
measureTime: new Date(measureTime).format('yyyy-MM-dd hh:mm:ss'),
flag: false
});
}
//初始化10行
// for (var i = 1; i < 10; i++) {
// me.getStore().insert(i, {
// measureTime: ''
// });
// }
},
listeners: {
beforeedit: function (editor, context, e) {
var me = this;
var row = context.rowIdx;
var grid = Eui.frame.Ui.getActiveTab().down("monitors-recordbook-editGrid");
try {
context.cell.onkeydown = function (event) {
var e = event || window.event || arguments.callee.caller.arguments[0];
if (e && (e.keyCode == 13 || e.keyCode == 108)) { // enter键 要做的事情
e.stopPropagation();
if (context.field == "note") { //保存当前行数据
//下一个测点
me.getController().nextSiteRecordBook(me);
} else { ///触发Tab 移动到下一格
var position = {
row: row,
column: context.colIdx + 1
};
try {
var cellEditing = grid.plugins[0];
cellEditing.startEditByPosition(position);
} catch (error) {
console.log(error)
}
}
};
}
} catch (error) {
console.log(error);
}
try {
setTimeout(function () { Ext.query('input[name=measureTime]')&&Ext.query('input[name=measureTime]')[0]&&Ext.query('input[name=measureTime]')[0].select(); }, 100);
} catch (error) {}
},
edit: function (editor, context, e) {
var number = context.rowIdx;
var me = this;
//获取当前行数据
var editing = editor.context.record.data;
var flag = false;
//修改测量时间和备注不用计算
if (context.field == 'note' || context.field == "measureTime") {
flag = false;
} else {
//比对必填项是否以填
for (var i = 0; i < this.dataTemplate.length; i++) {
var data = this.dataTemplate[i];
if (data.expression == "") {
if (editing[data.map] == null) {
return;
}
flag = true;
editing['flag'] = true;
}
}
}
//数据计算数据：那该条数据去后台计算结果
if (flag) {
var data = context.record.data;
me.calculation(data, number);
}
},
},
copyData: function (str) {
this.getStore().removeAt(0);
var me = this;
var rows = str.split('\r\n');
var lists = [];
for (var i = 0; i < rows.length; i++) {
var element = rows[i];
if (element == "") break;
var columns = element.split("\t");
var data = {};
//判断复制内容中是否包含日期
var k = 0;
if (isNaN(Number(columns[k]))) {
data.measureTime = columns[k];
k = 1;
} else {
data.measureTime = new Date(window.measureTime).format('yyyy-MM-dd hh:mm:ss');
}
for (j = 0; j < this.dataTemplate.length; j++) {
if (this.dataTemplate[j].expression == '') {
var it = isNaN(Number(columns[k])) ? 0 : Number(columns[k]);
data[this.dataTemplate[j].map] = it;
k++;
}
}
if (k < columns.length) {
data.note = columns[k];
}
delete data.id;
this.getStore().insert(i, data);
me.calculation(data, i);
}
},
calculation: function (data, number) {
var me = this;
data.instrumentId = this.record.instrumentId;
data.projectId = AppConfig.data.projectId;
window.measureTime = data.measureTime;
Ext.Ajax.request({
url: Api.app.instrumentData.findInstrumentData.url,
method: Api.app.instrumentData.findInstrumentData.method,
jsonData: {
instrumentData: data
},
success: function (response) {
var avatarData = Ext.util.JSON.decode(response.responseText);
var result = avatarData.result;
me.saveData(result, number);
}
});
},
saveData: function (result, number) {
var me = this;
me.map.set(number, result);
var tab = Eui.frame.Ui.getActiveTab();
var instrumentGrid = tab.down("monitors-instrumentdata-grid");
var record = instrumentGrid.getStore().getData().items;
var newData = [];
for (var i = 0; i < me.map.size; i++) {
var data = me.map.get(i);
data.instrumentName = me.record.name;
newData.push({
data: data
});
}
me.setGraph(record.concat(newData));
},
setGraph: function (records) {
var me = this;
var obj = [];
for (var i = 0; i < records.length; i++) {
var r = records[i];
obj.push(r.data)
}
//排序
obj.sort(function (a, b) {
var nowdate = new Date();
var temp1 = new Date(a.measureTime);
var temp2 = new Date(b.measureTime);
var dc1 = Math.abs((parseInt(nowdate - temp1) / 1000));
var dc2 = Math.abs((parseInt(nowdate - temp2) / 1000));
if (dc1 < dc2) {
return -1;
} else if (dc1 > dc2) {
return 1;
} else {
return 0;
}
});
var tab = Eui.frame.Ui.getActiveTab();
var iframe = tab.getEl().dom.querySelector('iframe');
if (iframe) {
if (iframe.contentWindow && iframe.contentWindow.inited) {
var frame = iframe.contentWindow;
me.gb = frame.editor.initChart(me.result, obj, me.dataTemplate);
}
}
}
})