editor_table
This commit is contained in:
YouWei Zhao
parent
ffb8a5e2b3
commit
1dda51bb3c
@ -5,9 +5,7 @@ editor_table_wrapper = function (editor) {
|
||||
}
|
||||
|
||||
/////////////////////////////////////////////////////////////////////////////
|
||||
/**
|
||||
* HTML模板
|
||||
*/
|
||||
// HTML模板
|
||||
|
||||
editor_table.prototype.select = function (value, values) {
|
||||
return `<select>\n${
|
||||
@ -40,9 +38,7 @@ editor_table_wrapper = function (editor) {
|
||||
|
||||
|
||||
/////////////////////////////////////////////////////////////////////////////
|
||||
/**
|
||||
* 表格生成的控制
|
||||
*/
|
||||
// 表格生成的控制
|
||||
|
||||
|
||||
/**
|
||||
@ -76,7 +72,6 @@ editor_table_wrapper = function (editor) {
|
||||
},
|
||||
}
|
||||
|
||||
/////////////////////////////////////////////////////////////////////////////
|
||||
/**
|
||||
* 把来自数据文件的obj和来自*comment.js的commentObj组装成表格
|
||||
* commentObj在无视['_data']的意义下与obj同形
|
||||
@ -108,23 +103,7 @@ editor_table_wrapper = function (editor) {
|
||||
// 表格抬头
|
||||
var outstr = [editor.table.title()];
|
||||
var guids = [];
|
||||
var defaultcobj = {
|
||||
// 默认是文本域
|
||||
_type: 'textarea',
|
||||
_data: '',
|
||||
_string: function (args) {//object~[field,cfield,vobj,cobj]
|
||||
var thiseval = args.vobj;
|
||||
return (typeof (thiseval) === typeof ('')) && thiseval[0] === '"';
|
||||
},
|
||||
// 默认情况下 非对象和数组的视为叶节点
|
||||
_leaf: function (args) {//object~[field,cfield,vobj,cobj]
|
||||
var thiseval = args.vobj;
|
||||
if (thiseval == null || thiseval == undefined) return true;//null,undefined
|
||||
if (typeof (thiseval) === typeof ('')) return true;//字符串
|
||||
if (Object.keys(thiseval).length === 0) return true;//数字,true,false,空数组,空对象
|
||||
return false;
|
||||
},
|
||||
}
|
||||
var defaultcobj = this.defaultcobj
|
||||
/**
|
||||
* 深度优先遍历, p*即为父节点的四个属性
|
||||
* @param {String} pfield
|
||||
@ -186,6 +165,73 @@ editor_table_wrapper = function (editor) {
|
||||
}
|
||||
// 开始遍历
|
||||
recursionParse("", "", obj, commentObj);
|
||||
|
||||
var listen = function (guids) {
|
||||
// 每个叶节点的事件绑定
|
||||
guids.forEach(guidListen);
|
||||
}
|
||||
return { "HTML": outstr.join(''), "guids": guids, "listen": listen };
|
||||
}
|
||||
|
||||
/**
|
||||
* 返回叶节点<tr>形如
|
||||
* tr>td[title=field]
|
||||
* >td[title=comment,cobj=cobj:json]
|
||||
* >td>div>input[value=thiseval]
|
||||
* 参数意义在 objToTable_ 中已解释
|
||||
* @param {Object} obj
|
||||
* @param {Object} commentObj
|
||||
* @param {String} field
|
||||
* @param {String} cfield
|
||||
* @param {Object} vobj
|
||||
* @param {Object} cobj
|
||||
*/
|
||||
editor_table.prototype.objToTr_ = function (obj, commentObj, field, cfield, vobj, cobj) {
|
||||
var guid = editor.guid();
|
||||
var thiseval = vobj;
|
||||
var comment = String(cobj._data);
|
||||
|
||||
var charlength = 10;
|
||||
// "['a']['b']" => "b"
|
||||
var shortField = field.split("']").slice(-2)[0].split("['").slice(-1)[0];
|
||||
// 把长度超过 charlength 的字符改成 固定长度+...的形式
|
||||
shortField = (shortField.length < charlength ? shortField : shortField.slice(0, charlength) + '...');
|
||||
|
||||
// 完整的内容转义后供悬停查看
|
||||
var commentHTMLescape = editor.HTMLescape(comment);
|
||||
// 把长度超过 charlength 的字符改成 固定长度+...的形式
|
||||
var shortCommentHTMLescape = (comment.length < charlength ? commentHTMLescape : editor.HTMLescape(comment.slice(0, charlength)) + '...');
|
||||
|
||||
var cobjstr = Object.assign({}, cobj);
|
||||
delete cobjstr._data;
|
||||
// 把cobj塞到第二个td的[cobj]中, 方便绑定事件时取
|
||||
cobjstr = editor.HTMLescape(JSON.stringify(cobjstr));
|
||||
|
||||
var outstr = ['<tr id="', guid, '"><td title="', field, '">', shortField, '</td>',
|
||||
'<td title="', commentHTMLescape, '" cobj="', cobjstr, '">', shortCommentHTMLescape, '</td>',
|
||||
'<td><div class="etableInputDiv">', editor_mode.objToTd_(obj, commentObj, field, cfield, vobj, cobj), '</div></td></tr>\n',
|
||||
];
|
||||
return [outstr.join(''), guid];
|
||||
}
|
||||
|
||||
editor_table.prototype.objToTd_ = function (obj, commentObj, field, cfield, vobj, cobj) {
|
||||
var thiseval = vobj;
|
||||
if (cobj._select) {
|
||||
var values = cobj._select.values;
|
||||
return editor.table.select(thiseval,values);
|
||||
} else if (cobj._input) {
|
||||
return editor.table.text(thiseval);
|
||||
} else if (cobj._bool) {
|
||||
return editor.table.checkbox(thiseval);
|
||||
} else {
|
||||
var num = 0;//editor_table.indent(field);
|
||||
return editor.table.textarea(thiseval,num);
|
||||
}
|
||||
}
|
||||
|
||||
/////////////////////////////////////////////////////////////////////////////
|
||||
// 表格的用户交互
|
||||
|
||||
var checkRange = function (cobj, thiseval) {
|
||||
if (cobj._range) {
|
||||
return eval(cobj._range);
|
||||
@ -198,9 +244,8 @@ editor_table_wrapper = function (editor) {
|
||||
}
|
||||
return true;
|
||||
}
|
||||
var listen = function (guids) {
|
||||
// 每个叶节点的事件绑定
|
||||
guids.forEach(function (guid) {
|
||||
|
||||
var guidListen=function (guid) {
|
||||
// tr>td[title=field]
|
||||
// >td[title=comment,cobj=cobj:json]
|
||||
// >td>div>input[value=thiseval]
|
||||
@ -309,69 +354,9 @@ editor_table_wrapper = function (editor) {
|
||||
editor_mode.addAction(['add', basefield + "['" + newid + "']", null]);
|
||||
editor_mode.onmode('save');//自动保存 删掉此行的话点保存按钮才会保存
|
||||
}
|
||||
});
|
||||
}
|
||||
return { "HTML": outstr.join(''), "guids": guids, "listen": listen };
|
||||
}
|
||||
|
||||
/**
|
||||
* 返回叶节点<tr>形如
|
||||
* tr>td[title=field]
|
||||
* >td[title=comment,cobj=cobj:json]
|
||||
* >td>div>input[value=thiseval]
|
||||
* 参数意义在 objToTable_ 中已解释
|
||||
* @param {Object} obj
|
||||
* @param {Object} commentObj
|
||||
* @param {String} field
|
||||
* @param {String} cfield
|
||||
* @param {Object} vobj
|
||||
* @param {Object} cobj
|
||||
*/
|
||||
editor_table.prototype.objToTr_ = function (obj, commentObj, field, cfield, vobj, cobj) {
|
||||
var guid = editor.guid();
|
||||
var thiseval = vobj;
|
||||
var comment = String(cobj._data);
|
||||
|
||||
var charlength = 10;
|
||||
// "['a']['b']" => "b"
|
||||
var shortField = field.split("']").slice(-2)[0].split("['").slice(-1)[0];
|
||||
// 把长度超过 charlength 的字符改成 固定长度+...的形式
|
||||
shortField = (shortField.length < charlength ? shortField : shortField.slice(0, charlength) + '...');
|
||||
|
||||
// 完整的内容转义后供悬停查看
|
||||
var commentHTMLescape = editor.HTMLescape(comment);
|
||||
// 把长度超过 charlength 的字符改成 固定长度+...的形式
|
||||
var shortCommentHTMLescape = (comment.length < charlength ? commentHTMLescape : editor.HTMLescape(comment.slice(0, charlength)) + '...');
|
||||
|
||||
var cobjstr = Object.assign({}, cobj);
|
||||
delete cobjstr._data;
|
||||
// 把cobj塞到第二个td的[cobj]中, 方便绑定事件时取
|
||||
cobjstr = editor.HTMLescape(JSON.stringify(cobjstr));
|
||||
|
||||
var outstr = ['<tr id="', guid, '"><td title="', field, '">', shortField, '</td>',
|
||||
'<td title="', commentHTMLescape, '" cobj="', cobjstr, '">', shortCommentHTMLescape, '</td>',
|
||||
'<td><div class="etableInputDiv">', editor_mode.objToTd_(obj, commentObj, field, cfield, vobj, cobj), '</div></td></tr>\n',
|
||||
];
|
||||
return [outstr.join(''), guid];
|
||||
}
|
||||
|
||||
editor_table.prototype.objToTd_ = function (obj, commentObj, field, cfield, vobj, cobj) {
|
||||
var thiseval = vobj;
|
||||
if (cobj._select) {
|
||||
var values = cobj._select.values;
|
||||
return editor.table.select(thiseval,values);
|
||||
} else if (cobj._input) {
|
||||
return editor.table.text(thiseval);
|
||||
} else if (cobj._bool) {
|
||||
return editor.table.checkbox(thiseval);
|
||||
} else {
|
||||
var num = 0;//editor_table.indent(field);
|
||||
return editor.table.textarea(thiseval,num);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/////////////////////////////////////////////////////////////////////////////
|
||||
editor.constructor.prototype.table = new editor_table();
|
||||
}
|
||||
//editor_table_wrapper(editor);
|
||||
22
_server/editor_util.js
Normal file
22
_server/editor_util.js
Normal file
@ -0,0 +1,22 @@
|
||||
editor_util_wrapper = function (editor) {
|
||||
|
||||
editor_util = function () {
|
||||
|
||||
}
|
||||
|
||||
editor_util.prototype.guid = function () {
|
||||
return 'id_' + 'xxxxxxxx_xxxx_4xxx_yxxx_xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
|
||||
var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
|
||||
return v.toString(16);
|
||||
});
|
||||
}
|
||||
|
||||
editor_util.prototype.HTMLescape = function (str_) {
|
||||
return String(str_).split('').map(function (v) {
|
||||
return '&#' + v.charCodeAt(0) + ';'
|
||||
}).join('');
|
||||
}
|
||||
|
||||
editor.constructor.prototype.util = new editor_util();
|
||||
}
|
||||
//editor_util_wrapper(editor);
|
||||
Loading…
Reference in New Issue
Block a user